JS中的继承(下)

在上一篇 JS中的继承(上) 咱们介绍了3种比较经常使用的js继承方法，若是你没看过，那么建议你先看一下，由于接下来要写的内容， 是创建在此基础上的.另外本文做为我我的的读书笔记,才疏学浅,若有错误,敬请指正.

接下来咱们要介绍另外3种相对比较奇葩的继承

一. 原型式继承

function clone (proto) {
    function F () {}
    F.prototype = proto
    return new F()
}
复制代码

clone 内部首先是建立了一个空的构造函数F,而后把F的prototype指向参数proto,最后返回一个F的实例对象,完成继承. 原型式继承看起来跟原型继承很像,事实上,二者由于都是基于prototype继承的,因此也有一些相同的特性,好比引用属性共享问题, 那原型式继承跟原型继承有什么区别呢? 一个比较明显的区别就是clone函数接收的参数不必定要是构造函数,也能够是其余任何对象, 这样咱们就至关因而浅复制了一个对象.

es5的Object.create()函数,就是基于原型式继承的

原型式继承是道格拉斯-克罗克福德 2006 年在 Prototypal Inheritance in JavaScript一文中提出的

二. 寄生式继承

寄生式继承其实就是在原型式继承的基础上,作了一些加强.

function cloneAndStrengthen(proto){
    function F () {}
    F.prototype = proto
    let f = new F()
    f.say = function() { 
        console.log('I am a person')
    }
    return f
}
复制代码

咱们看到上面的代码,跟原型式继承比,差异就是:在实例对象f返回以前,给f添加了一个say函数. 可是这样在实例对象上添加的引用属性(好比函数),跟构造函数模式同样, 实例对象的引用类型属性没法共享,尽管这既是缺点也是优势.

三. 寄生组合式继承
上一篇咱们提到的组合继承其实也有个缺点,就是父类构造函数里面的代码会执行2遍,第一遍是在原型继承的时候实例化父类, 第二遍是在子类的构造函数里面借用父类的构造函数,咱们能够用寄生组合式继承来解决这个问题

function inherit(sub, super){
    let prototype = clone(super.prototype)
    prototype.constructor = sub    
    sub.prototype = prototype      
}
复制代码

这样咱们就实现了一个寄生组合式继承的函数inherit,接下来咱们来使用一下:

function Person(name){}

function Student(){
    SuperType.call(this)
}

inherit(Student, Student)
复制代码

咱们用 inherit 函数替换了 Student.prototype = new Person(),从而避免了执行 new Person().

书上说: 寄生组合式继承是引用类型最理想的继承范式.

关于js的继承就介绍到这里，感谢收看，若是以为本文对您有用，请给本文的github加个star,万分感谢， 另外，github上还有其余一些关于前端的教程和组件，有兴趣的童鞋能够看看，大家的支持就是我最大的动力。