ES5中的继承通过修改原型链实现继承,而在ES6中class 可以通过extends关键字实现继承 ,要清晰和方便很多。
class Animal{
constructor(x, y) {
this.x = x;
this.y = y;
}
}
class Dog extends Animal{
constructor(x, y, type) {
super(x, y); // 调用父类的constructor(x, y)
this.type = type;
}
}
上面代码定义了一个Dog 类,该类通过extends关键字,继承了Animal类的所有属性和方法。
上面代码中的super关键字,它在这里表示父类的构造函数,用来新建父类的this对象。
子类必须在constructor方法中调用super方法,否则新建实例时会报错。
class Animal{
}
class Dog extends Animal{
constructor() {
}
}
let labrador = new Animal();//报错
extends关键字和super关键字是绑定出现的,两者必须同时使用,不然就会报错。
ES6 的继承机制完全不同,实质是先将父类实例对象的属性和方法,加到this上面(所以必须先调用super方法),然后再用子类的构造函数修改this。
class Animal{
constructor(x, y) {
this.x = x;
this.y = y;
}
}
class Dog extends Animal{
constructor(x, y, type) {
this.type = type;//报错
super(x, y);
}
}
上面代码中,子类的constructor方法没有调用super之前,就使用this关键字,结果报错,所以调用super必须在this关键字之前。
父类的静态方法,也会被子类继承。
class Animal{
static jiao(){
console.log('jiao');
}
}
class Dog extends Animal{
}
Dog.jiao();//jiao
上面代码中,jiao()是Animal类的静态方法,Dog继承Animal,也继承了Animal的静态方法。