- ES5的继承是通过原型链prototype 或者 构造函数机制来实现的。是指是创建子类的实例对象,然后再将父类的方法添加到this上(使用ParentType.apply(this))
-
ES6继承机制实质是先创建父类的实例对象this(所以必须先调用父类的 super 方法),然后再用子类的构造函数修改this
ES5继承
es的继承实现方式有好多种:(上篇文章说过啦:https://www.jianshu.com/p/c053e810b588
)
- 原型链继承
- 构造函数继承
- 组合继承
- 原型式继承
- 寄生继承
- 寄生组合式继承
ES6继承
使用class关键字直接定义类,加大括号,构造函数使用 constructor ,继承使用 extends 关键字。
一个简单的例子
class ColorPoint extends Point {
constructor(x, y, color) {
super(x, y); // 调用父类的constructor(x, y)
this.color = color;
}
toString() {
return this.color + ' ' + super.toString(); // 调用父类的toString()
}
}
- 注意
- 子类必须在constructor方法中调用super方法,否则新建实例时会报错。
因为子类自己的this对象,必须先通过父类的构造函数完成塑造,得到与父类同样的实例属性和方法,然后再对其进行加工,加上子类自己的实例属性和方法。如果不调用super方法,子类就得不到this对象
- super关键字
- 当函数使用是: super虽然代表了父类A的构造函数,但是返回的是子类B的实例,即super内部的this指的是B,因此super()在这里相当于 A.prototype.constructor.call(this,prop); super()只能用在子类的构造函数之中,用在其他地方就会报错。
-
当对象使用: 在普通方法中,指向父类的原型对象;在静态方法中,指向父类。 所以在子类的方法中super.print();指向的是父类原型上的方法。
但是因为super的两种用法,所以es6规定在使用必须要明确使用方式,像单独console.log(super) 就会报错。
- constructor
- constructor 方法是类的构造函数,是一个默认方法,通过 new 命令创建对象实例时,自动调用该方法。一个类必须有 constructor 方法,如果没有显式定义,一个默认的 consructor 方法会被默认添加。所以即使你没有添加构造函数,也是会有一个默认的构造函数的。一般 constructor 方法返回实例对象 this ,但是也可以指定 constructor 方法返回一个全新的对象,让返回的实例对象不是该类的实例。
-
static关键字
顾名思义是静态方法的意思,类相当于实例的原型, 所有在类中定义的方法, 都会被实例继承。 如果在一个方法前, 加上static关键字, 就表示该方法不会被实例继承, 而是直接通过类来调用, 这就称为“ 静态方法”。静态方法调用直接在类上进行,而在类的实例上不可被调用。静态方法通常用于创建 实用/工具 函数。
es6继承原理初窥
prototype 和__ proto __ : 一个继承语句同时存在两条继承链:一条实现属性继承,一条实现方法的继承
class A {
}
class B extends A {
}
B.__proto__ === A // true 继承属性
B.prototype.__proto__ === A.prototype //true 继承方法