浅谈JS继承

引言

         要知道在工程化开发中，避免不了会遇见多个对象内会有相同类别属性情形，本人在之前的一篇博客https://blog.csdn.net/weixin_43821550/article/details/96914857中已经谈到可以利用JS中的构造函数的原型提取这些共有属性但是并不是继承的全部，本篇主要讨论的是JS继承的一些方法，并通过比较得出最优雅的解决方案。

继承方案与解析

方案一：利用原型链进行继承，由于JS的构造函数的原型是它构造出来对象的公共祖先，因此这些被构造出来的对象都可以拿到这个构造函数原型上的属性。

Cat.prototype={
    find:'animal'
}
function Cat(){

}

var whiteCat = new Cat();
var balckCat = new Cat();

console.log(whiteCat.find)//animal
console.log(balckCat.find)//animal

根据例子可以看出如果Cat.prototype上有很多属性，但是我们实例化的对象不需要就会造成浪费。

弊端：会继承很多没有用的属性 

方案二：利用call/apply，借用别人的构造函数构造自己对象。（严格上讲不能叫做继承，但是和继承的结果类似因此也单独算作一个方案）

function Book(width,height){
    this.width = width;
    this.height = height;
}

function Fiction(width,height,color) {
    this.color = color;
    Book.call(this,width,height);
}
var fic = new Fiction(100,200,'red')

console.log(fic.width)//100
console.log(fic.heigth)//200

通过代码可以发现，我们只是使用call来使用函数Book的方法，但是我们无法使用Book的原型，并且在构造函数fic时，不但要执行Fiction还要执行Book这个函数

弊端：不能借用构造函数的原型，不能每次构造函数都要多执行一个函数

方案三：共享原型

function inherit(target, origin){
    target.prototype = origin.prototype
}


inherit(对象1,对象2)

弊端：不能随意改变自己的原型，一旦改变就其共享的原型也会改变。

方案四：圣杯模式（闭包）

var inherit = (function (){
    var F = function (){};
    return function (target,origin){
        F.prototype = origign.prototype;
        target.prototype = new F();
        target.prototype.constuctor = target;
        target.prototype.uber = origin.prototype;
    }
}())

利用圣杯模式继承很好的解决了方案三中不能改变自己原型的问题，并且自己构造函数的指向正好是自己的构造函数。