js實現類繼承

為了讓自己能把繼承的實現機制理解得更透徹，還是決定看能不能通過自己的理解講述出來，以下文章如有不妥之處請積極批評指正，感激不盡。

我們知道js中一切皆物件，但是當我們把流行的物件導向的語言特性套到js身上時卻略顯尷尬，為啥？js沒有提供繼承機制，這個得我們自己動手來模擬實現。

不管是傳統的方法還是所謂的先進方法，都逃脫不了原型的使用，頂多是在這個上面去做文章來對繼承模式進行優化和原則。大致可以分為兩大類：一類是原型對映例項方法；一類是原型對映原型（俗稱原型共享）。

我們先來看第一段**：

function inherit(c,p)

function parent()

parent.prototype.say = function();

function child(){}

inherit(c,p)

inherit(child,parent);

var child = new child();

這段**很直白，inherit是來實現繼承的方法，這種實現方法直接將子類的原型指向乙個父類的例項。可以用乙個示意圖來看：

學過c語言和c++的同學對指標都不陌生，我們可以把上面的看成乙個鍊錶，child的原型指標指向乙個parent的例項物件，例項物件的原型指標指向parent.prototype物件，從而形成了乙個原型鏈。通過這種方式做的繼承，child會繼承到parent例項的加到this的屬性以及加到原型上的方法。

那麼其實這裡實際上可以理解為用parent的建構函式給child構造了乙個例項物件，通過child.constructor可以檢視它實際呼叫的建構函式。

我們再來看另外一段**，將上面的**稍作修改

function inherit(c,p)

function parent()

parent.prototype.say = function();

function child(){}

inherit(c,p)

inherit(child,parent);

var child = new child();

可以用下圖來理解

我們將child的原型物件指向parent的原型物件，這樣就可以實現對parent的原型繼承啦。child可以訪問parent的所有註冊在原型上的屬性。但是，由於他們指向的乙個原型，所以任何子類對原型的修改會影響到它的所有祖先類。

那麼還有另外的繼承實現，也只是將兩種方法綜合起來，用乙個**類，作為橋梁，**如下：

function inherit(c,p);

proxy.prototype = p.prototype;

c.prototype = new proxy(); }

function parent()

parent.prototype.say = function();

function child(){}

inherit(c,p)

inherit(child,parent);

var child = new child();

類似這種方法，利用**類proxy的原型指向parent的原型，再將proxy的例項賦值給child的原型，這樣使得child只繼承了parent原型的屬性。這裡需要注意的是，parent的建構函式時沒有呼叫的。使用**類的好處是子類的原型和父類的原型並不是指向同一位址，因此，子類對其原型的更改是不會影響到祖先類的。

測試一下：

child.prototype.jump = function();

使用這段**進行測試方法2和方法3，會發現直接使用原型共享的方法呼叫jump方法都是可以的，無論是child還是parent對原型的更改都會影響彼此，而使用**的方式，子類對原型的更改就不會影響父類啦。

若有偏頗，請及時提醒，多謝！

js實現類繼承

js 類的繼承實現

JS實現繼承

js實現繼承

js實現類繼承

js 類的繼承實現

JS實現繼承

js實現繼承

相關推薦