(精华)2020年7月4日 JavaScript高级篇 ES6(class类的继承)

class Father{ constructor(){ this.name = '父亲' this.age = 33 } work(){ console.log('我是父类'); } } class Children extends Father{ constructor(name,age,play){ super() this.name = name } } let personZhang = new Children('tony',44,'打游戏') console.log(personZhang.name);

super

// 通过extends // super 关键字 // 继承必须要在constructor方法中去调用super // 原因是子类自己的this对象 必须通过父类的构造函数生成 // 不调用super 子类就得不到this对象 class A{ // 属性应该怎么写？？？ pA = 123 p(){ return 3 } } A.prototype.pA = 123 class B extends A{ constructor(){ super() console.log(super.p()) // 3 console.log(super.pA)// undefined } } // 调用super后内部的this指向子类的实例 class A{ constructor(){ this.x = 1 } print(){ console.log(this.x); } } class B extends A{ constructor(){ super() this.x = 2 } fn(){ super.print() // 相当于 es5里面的super.print.call(this) } } // 通过super对属性赋值 这时的super相当于this class A{ constructor(){ this.x = 1 } } // A.prototype.x = 3 class B extends A{ constructor(){ super() this.x = 2 super.x = 3 // this.x = 3 console.log(super.x); // undefined console.log(this.x); // 3 } } // super作为对象在静态方法中 // 指向父类而不是原型对象 class Parent{ static myMethod(msg){ console.log(`static-${msg}`); } myMethod(msg){ console.log(`普通-${msg}`); } } class Child extends Parent{ static myMethod(msg){ super.myMethod(msg) } myMethod(msg){ super.myMethod(msg) } } // 子类的静态方法中通过super调用父类的方法时 // 方法内部的this指向当前的子类 而不是子类的实例 class A{ constructor(){ this.x = 1 } static print(){ console.log(this.x); } } class B extends A{ constructor(){ super() this.x = 2 } static fn(){ super.print() } }