繼承是面向對象軟件技術當中的一個概念，與多態(tài)、封裝共為面向對象的三個基本特征。繼承可以使得子類具有父類的屬性和方法或者重新定義、追加屬性和方法等。
下面我們來分析一下前端開發(fā)中常用的幾種繼承。

原型鏈繼承

原型鏈繼承，就是讓對象實例通過原型鏈的方式串聯(lián)起來，當訪問目標對象的某一屬性時，能順著原型鏈進行查找，從而達到類似繼承的效果。

/**
 * 父
 * @param {*} obj 
 */
function Parent(obj={a:1,b:2}){
    this.obj=obj;

    this.toString=function(){
          console.log(JSON.toString(obj))
    }

}
/**
 * 子
 * @param {*} data 
 */

function Child(data){
    this.data=data;
}
//將子類的原型指向父類的實例
Child.prototype=new Parent(); //缺陷：創(chuàng)建子類實例時候不能給Parent 傳參
//創(chuàng)建子類實例1
let c1=new Child(1);
//創(chuàng)建子類實例2
let c2=new Child(2);
//獲得父類的繼承的值
c1.obj; //{a: 1, b: 2}
c2.obj; //{a: 1, b: 2}
//修改
c1.obj.c=3;
c1.obj; //{a: 1, b: 2, c: 2} 
c2.obj; //{a: 1, b: 2, c: 2} 實例1修改或導致實例獲取值也會改變（因為是修改是原型對象導致原型鏈污染）

通過原型鏈可以去到父類的屬性達到繼承的目的，但是這種方法存在兩種缺陷
缺陷
1：創(chuàng)建子類實例無法想父類傳參。因為是子類的原型指向父類的實例。
2：創(chuàng)建了多個子類實例，子類實例修改原型對象屬性，會造成同步修改。（代碼中有顯示）

2:組合繼承
鑒于原型鏈繼承存在以上兩種缺陷，衍生出組合繼承，可以解決上述缺陷。
組合繼承：使用 call 在子類構造函數(shù)中調(diào)用父類構造函數(shù)。

//父類和原型鏈繼承相同

//子類 
function Child(obj){
    //相當于重新執(zhí)行一次 父類
    Parent.call(this,obj);

}
//可以向父類傳參
var c3=new Child({a:1,b:2});
var c4=new Child({a:3,b:4});

c3.obj; //{a: 1, b: 2}
c4.obj; //{a: 3, b: 4}
//修改
c3.obj.c=3;
c3.obj; //{a: 1, b: 2, c: 3} 
c4.obj; //{a: 3, b: 4} 發(fā)現(xiàn)并沒有修改 c4

缺陷
Parent 被執(zhí)行兩次消耗內(nèi)存，影響性能。

寄生組合繼承
針對組合繼承存在的缺陷，又進化出了“寄生組合繼承”：使用 Object.create(Parent.prototype) 創(chuàng)建一個新的原型對象賦予子類從而解決組合繼承的缺陷：
Object.create()方法創(chuàng)建一個新對象，使用現(xiàn)有的對象來提供新創(chuàng)建的對象的proto。
可點擊鏈接查看Object.create 的api
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/create

//取代 Child.prototype=new Parent() 
//組合繼承 
function Child(obj){
    //相當于重新執(zhí)行一次 父類
    Parent.call(this,obj);

}
//將子類的原型指向父類的實例
Child.prototype = Object.create(Parent.prototype)
var c5=new Child({a:1,b:2});
var c6=new Child({a:3,b:4});

c5.obj; //{a: 1, b: 2}
c6.obj; //{a: 3, b: 4}
//修改
c5.obj.c=3;
c5.obj; //{a: 1, b: 2, c: 3} 
c6.obj; //{a: 3, b: 4} 發(fā)現(xiàn)并沒有修改 c6

class 繼承
class 繼承是ES6 新增屬性。關于class 繼承點擊下面鏈接可查看。
http://www.itdecent.cn/p/a30c931a6ef9