文章目录

   含着劲跳糖来聊一下ES5继承和ES6继承的区别,在ES6还没有发布的时候 ,js定义类是以函数的形式,例如

function TestFather() {
this.aa = ‘aa’;
}
TestFather.prototype.getAA = function() {
return this.aa
}

   而ES6 已经可以用关键class来定义个类 例如

class TestFather {
constructor() {
this.aa = ‘aa’;
}
getAA() {
return this.aa;
}
}
let father = new TestFather();
father.getAA();

ES5中构造函数是function函数本身 而 ES6中构造函数 是constructor 函数,类似与java
接下来谈一下ES5继承和ES6继承
ES5继承是

function AA () {
this.aa = ‘aa’
}
AA.prototype.getAA = function() {
console.log(this)
return this.aa
}
function BB() {
AA.call(this)
}
BB.prototype = new AA()
BB.prototype.constructor = BB
let bb = new BB()
bb.getAA() // log BB { aa: ‘aa’ }

而ES6的中继承

class AA {
constructor() {
this.aa = ‘aa’
}
getAA() {
console.log(this)
return this.aa
}
}
class BB extends AA {
constructor() {
super()
}
}
let bb = new BB() // log BB { aa: ‘aa’ }
bb.getAA()

    ES6中子类继承父类的属性使用了super关键字,ES6语法实现是ES5的语法糖,表面上 ES6的类关键字和子类继承关键字 实现的结构和ES5继承一样 但是根本还是有差别的 其中ES5继承prototype属性是先实例化父类 直接继承 而 ES6实在实例化子类对象时继承父类prototype,即实例化父类。

文章目录