史上最为详细的javascript继承(推荐)(3)

咱们看了上面的组合继承看上去已经很完美了,但是也有缺点(父类被实例化两次、子类实例和子类的构造函数都有相同的属性),寄生组合就是来解决这些问题的

代码实现:

function inheritPrototype({SubType,SuperType}){ const prototype = Object(SuperType.prototype); prototype.constrcutor=SubType; SubType.prototype=prototype; } function SuperType(name){ this.name=name; this.friends=['a','b'] } SuperType.prototype.getName=function(){ return this.name; } function SubType(name,age){ this.age=age; SuperType.call(this,name) } inheritPrototype({SubType,SuperType}); SubType.prototype.getAge=function(){ return this.age } var SubTypeShiny = new SubType('Shiny',23); SubTypeShiny .friends.push('c') var SubTypeRed = new SubType('Red',21); SubTypeRed .friends.push('d') console.log(SubTypeShiny.getName())//Shiny console.log(SubTypeShiny.getAge())//22 console.log(SubTypeShiny.friends)//['a','b','c'] console.log( SubTypeRed.getName())//Red console.log( SubTypeRed.getAge())//21 console.log( SubTypeRed.friends)//['a','b','d']

基本原理

子类构造函数内通过call、apply方法进行修改父类构造函数的this和执行父类构造函数,使的子类的实例拥有父类构造函数的一些属性,
结合子类的原型修改成父类构造函数的原型,并把父类的原型的constructor指向子类构造函数

使用场景

在考不使用构造函数的情况下实现继承,前面示

范继承模式时使用的 object()函数不是必需的;任何能够返回新对象的函数都适用于此模式

语言实现

极度类似组合寄生方式,只是修改了子类原型链继承的方式,组合寄生是继承父类的实例,寄生组合寄生则是通过一子类的原型继承父类的原型,并把该原型的constructor指向子类构造函数

优点

在少一次实例化父类的情况下,实现了原型链继承和借用构造函数

减少了原型链查找的次数(子类直接继承超类的prototype,而不是父类的实例)

缺点

暂无

下面是组合继承和寄生组合继承的原型图对比

史上最为详细的javascript继承(推荐)

以上所述是小编给大家介绍的javascript继承详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/3eff3a31242aad5a8364bfe4a0337774.html