主要介绍了ES6新特性之类(Class)和继承(Extends)相关概念与用法,结合实例形式较为详细的分析了ES6中类(Class)和继承(Extends)的基本概念、语法、使用方法与注意事项,需要的朋友可以参考下
在ES6中，类（Class）和继承（Extends）是两种重要的新特性，它们引入了更接近传统面向对象编程的语法，使JavaScript在表达对象和类的关系时更加清晰。
一、类（Class）
1. **基本语法**：
在ES5中，我们通常使用构造函数来创建对象。例如，`Point` 类可以通过以下方式定义：
```javascript
function Point(x, y) {
this.x = x;
this.y = y;
}
Point.prototype.toString = function () {
return '(' + this.x + ', ' + this.y + ')';
};
var p = new Point(1, 2);
```
ES6引入了`class`关键字，使得类的定义更加简洁和直观：
```javascript
class Point {
constructor(x, y) {
this.x = x;
this.y = y;
}
toString() {
return '(' + this.x + ', ' + this.y + ')';
}
}
var p = new Point(1, 2);
```
`constructor` 是每个类必须有的方法，它在创建新对象时自动调用，用于初始化实例的属性。
2. **原型与方法**：
类的方法实际上还是定义在类的`prototype`属性上。这意味着即使使用了`class`，类的方法依然可以通过原型访问。
二、继承（Extends）
1. **继承语法**：
使用`extends`关键字，一个类可以继承另一个类。这简化了ES5中基于原型链的继承方式：
```javascript
class ColorPoint extends Point {
constructor(x, y, color) {
super(x, y); // 调用父类的constructor
this.color = color;
}
toString() {
return this.color + ' ' + super.toString(); // 调用父类的toString
}
}
```
在子类的构造函数中，必须使用`super`调用父类的构造函数，以确保父类的属性正确初始化。不调用`super`会导致`this`未定义，从而引发错误。
三、原生构造函数继承
在ES6之前，原生构造函数（如`Array`, `String`等）不能被继承。但ES6改变了这一点，允许自定义原生数据结构的子类。例如，创建一个继承自`Array`的`MyArray`类：
```javascript
class MyArray extends Array {
constructor(...args) {
super(...args);
}
}
var arr = new MyArray();
arr[0] = 12;
arr.length; // 1
arr.length = 0;
arr[0]; // undefined
```
这里，`MyArray`可以像原生`Array`一样使用，并且能自定义行为。
四、Generator方法
如果类中的方法前有星号`*`，则表示该方法是一个生成器（Generator）。生成器允许函数暂停执行，可以在稍后恢复。在类中使用生成器可以创建复杂的异步逻辑。例如：
```javascript
class AsyncOperation {
constructor(time) {
this.time = time;
}
*run() {
console.log('Start');
yield new Promise(resolve => setTimeout(resolve, this.time));
console.log('Finished');
}
}
let operation = new AsyncOperation(2000);
let iterator = operation.run();
iterator.next(); // 输出 "Start"
setTimeout(() => iterator.next(), 1000); // 当定时器触发时，输出 "Finished"
```
在这个例子中，`run` 方法是一个生成器，它在开始时打印 "Start"，然后暂停，等待定时器完成后再继续执行，最后输出 "Finished"。
ES6的类和继承为JavaScript带来了更符合面向对象编程的习惯，同时支持对原生构造函数的继承，以及在类中使用生成器进行异步控制流管理。这使得开发者能够更好地利用JavaScript进行大型项目开发。
