1.简介
说明:class可以通过extends关键字实现继承,让子类继承父亲的属性和方法
class Fun {constructor(x, y) {this.x = xthis.y = y}talk() {console.log("talk方法");}tell() {console.log("tell方法");}}class Fun1 extends Fun {}const obj1 = new Fun1()obj1.talk() //talk方法
注意:Fun是父类,Fun1是子类,它通过extends关键字,继承了Fun所有属性和方法,等于复制Fun类。ES6规定,子类必须constructor方法中调用super(),否则就会报错。这是因为子类自己的this对象,必须先通过父类的构造函数来塑造。
1.1为什么一定要调用super()?
说明:ES6继承机制是先将父类的属性和方法,加到一个空对象上面,然后再将该对象作为子类的实例,即继承再前,实例在后。子类的构造函数中,只有调用super()方法之后,才可以使用this关键字。子类实例的构建,必须先完成父类的继承,只有具有了super方法才能让子类实例继承父类。
2.私有属性和私有方法的继承
说明:父类所有的属性和方法,都会被子类继承,除了私有的属性和方法。
class Fun2 {#name = "李四"name = "王二"#talk() {console.log("我是私有talk方法");}talk() {console.log("我是公有talk方法");}getMethod() {console.log(this.#name); //李四}}class Fun3 extends Fun2 {}class Fun4 extends Fun2 {constructor() {super()// console.log(this.#name);//Private field '#name' must be declared in an enclosing class }}const obj3 = new Fun3()console.log(obj3); //Fun3
说明:因此,子类无法直接访问这些私有属性和方法,但可以通过继承关系间接地访问到它们(原型链)。
3.静态属性和静态方法的继承
说明:静态属性是通过浅拷贝实现继承的,如果父类的静态属性是一个对象的时候,那么子类的静态属性也会指向这个对象,浅拷贝只会拷贝对象的地址值。
4.Object.getPrototypeOf方法
说明:从子类获取父类。
class Fun5 {}class Fun6 extends Fun5 {}console.log(Object.getPrototypeOf(Fun6) === Fun5); //true
注意:也可以认为Fun5是在Fun6的原型链上。
5.super关键字
说明:super关键字可以当对象使用和函数使用,用法不同。
- 情况1是super作为函数调用时,代表父类的构造函数。
- 情况2是suepr作为对象的,普通方法中,指向父类的原型对象,在静态方法中,指向父类。
class Fun7 {tell() {console.log("我是父类的Fun7方法");}}class Fun8 extends Fun7 {constructor() {super()super.tell() //等价于super.prototype.tell()}}const obj8 = new Fun8()obj8.tell()// Fun8.tell()// 我是父类的Fun7方法// 我是父类的Fun7方法
5.1super对象
说明:super指向父类的原型对象,所有定义在父类实例上的方法或属性,是无法通过super调用的。
class Fun9 {constructor(x) {this.x = 3}}Fun9.prototype.y = 5class Fun10 extends Fun9 {constructor() {super()}get value() {console.log(super.x);}}const obj10 = new Fun10()obj10.value //undefinedconsole.log(obj10.y);//5
注意:ES6 规定,在子类普通方法中通过super调用父类的方法时,方法内部的this指向当前的子类实例。
5.2super对象方法赋值
说明:由于this指向子类实例,所以如果通过super对某个属性赋值,这时super就是this,赋值的属性会变成子类实例的属性。
class Fun11 {constructor() {this.x = 1}}Fun11.prototype.layerA = 10class Fun12 extends Fun11 {constructor() {super()this.x = 2super.x = 30}talk() {console.log(super.x); }talk1(){console.log(super.layerA);}}const obj12 = new Fun12()console.log(obj12.x); //30obj12.talk() //undefinedobj12.talk1() //10
注意:super对象在读值的情况下是找父类原型, super对象在赋值的情况下super指向的是子类的实例对象。子类的静态方法中通过super调用父类的方法时,方法内部的this指向当前的子类,而不是子类的实例。
6.类的prototype属性和__proto__属性
- 子类的__proto__属性,表示构造函数的继承,总是指向父类
- 子类prototype属性的__proto__属性,表示方法的继承,总是指向父类的prototype属性。
class Fun13 {}class Fun14 extends Fun13{}console.log(Fun14.__proto__===Fun13);//trueconsole.log(Fun14.prototype.__proto__===Fun13.prototype);//true
7.实例的__proto__属性
说明:子类实例__proto__属性的__proto__属性,指向父类实例的__proto__属性。也就是说,子类实例对象的原型的原型,是父类实例对象的原型。
8.Mixin模式的实现
说明:Mixin指的是多个对象合成一个新的对象,新对象具有各个组成成员的接口,它的最简单实现如下。
const arr1=[1]const arr2=[2]const arr3=[...arr1,...arr2]