摘要：借用構(gòu)造函數(shù)繼承針對上面的繼承方法的缺點(diǎn)，開發(fā)人員使用一種叫做借用構(gòu)造函數(shù)的技術(shù)，也就是我們平時(shí)說的跟繼承。

繼承是 OO 語言中一個(gè)最為津津樂道的概念，許多 OO 語言都支持兩種繼承方式：接口繼承和實(shí)現(xiàn)繼承。接口繼承只繼承方法簽名，而實(shí)現(xiàn)繼承則繼承實(shí)際的方法。由于函數(shù)沒有簽名，在 ECMAScript 中無法實(shí)現(xiàn)接口繼承。ECMAScript 只支持實(shí)現(xiàn)繼承而且實(shí)現(xiàn)繼承主要是依靠原型鏈來實(shí)現(xiàn)的。

關(guān)于原型鏈，我之前的文章里面有介紹，如果有些忘記了，可以看這篇文章。
下面我將詳細(xì)的介紹前端前輩在開發(fā)過程中不斷摸索創(chuàng)造的幾種繼承方式?？赐昝嬖嚨臅r(shí)候千萬不要簡單的回答 call 跟 apply 了。
為了說起來省事，雖然 js 沒有嚴(yán)格意義的類，我還是以父類和子類來做區(qū)分繼承關(guān)系。

既然子類想要繼承父類的全部方法，而且我們知道父類的實(shí)例擁有父類所有的方法，那么接下類就好辦了，我將子類的 prototype 指向父類的實(shí)例，子類就擁有了父類的全部方法了

// 定義父類
function Parent (name, age) {
    this.name = name;
    this.age = age;
}
Parent.prototype.sayName = function () {
    alert(this.name);
}
// 定義子類
function Child (sex) {
    this.sex = sex;
}
// 實(shí)現(xiàn)繼承
var p = new Parent("leizore", 25);
Child.prototype = p;
var child = new Child("男");
child.sayName();            // leizore

那么對應(yīng)的關(guān)系圖如下：

這種方式 Child 繼承了 Person 的全部方法，但是也是有缺點(diǎn)的。

創(chuàng)建子類實(shí)例時(shí)，無法向父類構(gòu)造函數(shù)傳參。指定 prototype 時(shí)，實(shí)例化 Person 傳的參數(shù)，會出現(xiàn)在所有子類上，不靈活。

由圖可以看到，p 的 contructor 指向 Person， 所以 Child.prototype.constructor 也指向 Person，顯然會導(dǎo)致繼承鏈的紊亂。

針對上面的繼承方法的缺點(diǎn)1，開發(fā)人員使用一種叫做借用構(gòu)造函數(shù)的技術(shù)，也就是我們平時(shí)說的 call 跟 apply 繼承。

// 定義父類
function Parent (name, age) {
    this.name = name;
    this.age = age;
}
Parent.prototype.sayName = function () {
    alert(this.name);
}
// 定義子類
function Child (name, age, sex) {
     // 繼承，同時(shí)傳遞了參數(shù)
    Parent.call(this, name, age)
    this.sex = sex;
}

這里簡單講一下 call（apply)是如何實(shí)現(xiàn)的，其實(shí)就是將 call（apply) 前面的函數(shù)立即執(zhí)行一遍，并且執(zhí)行時(shí)將作用域 this 指向 call（apply) 函數(shù)的第一個(gè)參數(shù)，比如這里的 call 就是將 Parent 實(shí)例一遍，將 name 跟 age 當(dāng)成參數(shù)傳過去
這種繼承方式解決了繼承過程中的傳參問題，但是缺點(diǎn)是并沒有繼承到父類的原型，為了解決這個(gè)問題，我們很容易想到將上面兩個(gè)方法結(jié)合起來不久好了。于是另一種繼承方式出現(xiàn)了

沒錯(cuò)，就是兩種方式并用，從而發(fā)揮兩者之長的一種繼承模式，代碼如下

// 定義父類
function Parent (name, age) {
    this.name = name;
    this.age = age;
}
Parent.prototype.sayName = function () {
    alert(this.name);
}
// 定義子類
function Child (name, age, sex) {
    // 繼承，同時(shí)傳遞了參數(shù)
    Parent.call(this, name, age)
    this.sex = sex;
}
Child.prototype = new Parent("leizore", 25);

嗯，這種方式基本上解決了開發(fā)過程中繼承的痛點(diǎn)，成為好多人常用的繼承模式之一。但是缺點(diǎn)也是有的

重復(fù)定義了屬性，可以看到將 Child 的 prototype指向 Perent 的實(shí)例時(shí)，繼承了name 跟 age 屬性，實(shí)例 Child 的時(shí)候，調(diào)用 call 函數(shù)，又繼承了一次，雖然使用 call 調(diào)用這次的屬性是在實(shí)例屬性上，當(dāng)獲取name時(shí)優(yōu)先返回實(shí)例屬性，然后在 prototype 上，所以并不會出大問題。

第一種繼承方式方式的缺點(diǎn)二也完美的繼承過來了，Child.prototype.constructor 還是指向 parent

那么肯定有人會說，既然Child.prototype.constructor 不指向自己，那么直接讓他指向自己不就好了？

Child.prototype.constructor = Child;

答案是不行的。因?yàn)?Child.prototype 是 Parent 的實(shí)例，這樣操作會將 Parent.prototype.constructor 也指向 Child，顯然也是不合理的。

為了解決上面 Child 與 Parent 繼承之后糾纏不清的問題，道格拉斯在2006年提出一種繼承方法，它的想法是借助原型可以給予已有的對象創(chuàng)建新對象，同時(shí)還不必因此創(chuàng)建自定義類型。函數(shù)如下

function object (o) {
    function F() {}
    F.prototype = o;
    return new F();
}

這個(gè)模式相當(dāng)與創(chuàng)建一個(gè)新的對象，對象繼承了o所有屬性，當(dāng)然這里也只是實(shí)現(xiàn)了淺拷貝。

嗯，想必大家也想到了，上面這種繼承方式可以解決 Child 與 Parent 繼承后的糾纏不清的關(guān)系?？梢杂?object 方法創(chuàng)建一個(gè)臨時(shí)對象，從而斬?cái)喔?Parent 的聯(lián)系。就可以放心的對 Child 原型的constructor 隨便指了，當(dāng)然了為了繼承鏈的不紊亂，還是指向自己比較好

// 定義父類
function Parent (name, age) {
    this.name = name;
    this.age = age;
}
Parent.prototype.sayName = function () {
    alert(this.name);
}
// 定義子類
function Child (name, age, sex) {
    // 繼承，同時(shí)傳遞了參數(shù)
    Parent.call(this, name, age)
    this.sex = sex;
}
function object (o) {
    function F() {}
    F.prototype = o;
    return new F();
}
var prototype = object(Parent.prototype);
prototype.constructor = Child;
Child.prototype = prototype;


var c = new Child("leizore", 11, "men");
c.sayName()                // leizore
c.constructor === Child    // true

到此，基本上解決了上面所說的所有缺點(diǎn)。當(dāng)然了，也是有一點(diǎn)問題的，就是方法四的實(shí)現(xiàn)其實(shí)是淺拷貝，如果 Parent.prototype 里又引用類型比如數(shù)組，對象，改變Parent.prototype，Child 也會跟著變，解決方式也很簡單，使用深拷貝就行了，同時(shí)又可以寫很多繼承方式。當(dāng)然了，按照我上面順下來的思想，也可以寫出自己的繼承方式
比如下面改變object函數(shù)：

// 定義父類
function Parent (name, age) {
    this.name = name;
    this.age = age;
}
Parent.prototype.sayName = function () {
    alert(this.name);
}
// 定義子類
function Child (name, age, sex) {
    // 繼承，同時(shí)傳遞了參數(shù)
    Parent.call(this, name, age)
    this.sex = sex;
}
function object (o) {
    var c = {};
　　 for (var i in o) {
　　　　　c[i] = o[i];
　　 }
　　 return c
}
var prototype = object(Parent.prototype);
prototype.constructor = Child;
Child.prototype = prototype;


var c = new Child("leizore", 11, "men");
c.sayName()                // leizore
c.constructor === Child    // true

當(dāng)然了,es6 中，可以通過extends關(guān)鍵字實(shí)現(xiàn)繼承，這里就不多說了

javascript 高級程序設(shè)計(jì)

Javascript面向?qū)ο缶幊蹋ǘ簶?gòu)造函數(shù)的繼承