JavaScript繼承方式詳解

2021-06-28 00:04:13 字數 2357 閱讀 5194

js裡常用的如下兩種繼承方式：

原型鏈繼承（物件間的繼承）


類式繼承（建構函式間的繼承）
在物件導向的語言中，我們使用類來建立乙個自定義物件。然而js中所有事物都是物件，那麼用什麼辦法來建立自定義物件呢？這就需要用到js的原型：

我們可以簡單的把prototype看做是乙個模版，新建立的自定義物件都是這個模版（prototype）的乙個拷貝 （實際上不是拷貝而是鏈結，只不過這種鏈結是不可見，新例項化的物件內部有乙個看不見的__proto__指標，指向原型物件）。

js可以通過建構函式和原型的方式模擬實現類的功能。 另外，js類式繼承的實現也是依靠原型鏈來實現的。

類式繼承是在子型別建構函式的內部呼叫超型別的建構函式。

嚴格的類式繼承並不是很常見，一般都是組合著用：

function super()


function sub()
原型式繼承是借助已有的物件建立新的物件，將子類的原型指向父類，就相當於加入了父類這條原型鏈

為了讓子類繼承父類的屬性（也包括方法），首先需要定義乙個建構函式。然後，將父類的新例項賦值給建構函式的原型。**如下：

以上原型鏈繼承還缺少一環，那就是object，所有的建構函式都繼承自object。而繼承object是自動完成的，並不需要我們自己手動繼承，那麼他們的從屬關係是怎樣的呢？

可以通過兩種方式來確定原型和例項之間的關係。操作符instanceof和isprototypeof()方法：

alert(brother instanceof object)//true


alert(test instanceof brother);//false,test 是brother的超類


alert(brother instanceof child);//true


alert(brother instanceof parent);//true
只要是原型鏈中出現過的原型，都可以說是該原型鏈派生的例項的原型，因此，isprototypeof()方法也會返回true

在js中，被繼承的函式稱為超型別（父類，基類也行），繼承的函式稱為子型別（子類，派生類）。使用原型繼承主要由兩個問題：

一是字面量重寫原型會中斷關係，使用引用型別的原型，並且子型別還無法給超型別傳遞引數。

偽類解決引用共享和超型別無法傳參的問題，我們可以採用「借用建構函式」技術

借用建構函式雖然解決了剛才兩種問題，但沒有原型，則復用無從談起，所以我們需要原型鏈+借用建構函式的模式，這種模式稱為組合繼承

組合式繼承是比較常用的一種繼承方法，其背後的思路是 使用原型鏈實現對原型屬性和方法的繼承，而通過借用建構函式來實現對例項屬性的繼承。這樣，既通過在原型上定義方法實現了函式復用，又保證每個例項都有它自己的屬性

這種繼承借助原型並基於已有的物件建立新物件，同時還不用建立自定義型別的方式稱為原型式繼承

原型式繼承首先在obj()函式內部建立乙個臨時性的建構函式 ，然後將傳入的物件作為這個建構函式的原型，最後返回這個臨時型別的乙個新例項。

這種繼承方式是把原型式+工廠模式結合起來，目的是為了封裝建立的過程。

組合式繼承是js最常用的繼承模式，但組合繼承的超型別在使用過程中會被呼叫兩次；一次是建立子型別的時候，另一次是在子型別建構函式的內部

以上**是之前的組合繼承，那麼寄生組合繼承，解決了兩次呼叫的問題。

// 定義乙個全域性函式


function foo() 


// 定義乙個全域性變數


// 自定義乙個物件


var pack = ;


// 等價於window.foo();


// 此時foo中的this === pack

JavaScript實現繼承方式

student.prototype new person 得到乙個 person 例項，並且這個例項指向構造器的 prototype 屬性和呼叫了建構函式，因為呼叫的建構函式，而 student 只是乙個類，並沒有例項化，只為了繼承，呼叫建構函式建立乙個例項，引數的問題就不容易解決。例如 當 per...

JavaScript 繼承方式詳解

js 中實現繼承有兩種常用方式 原型鏈繼承 物件間的繼承 類式繼承 建構函式間的繼承 在物件導向的語言中，可以使用類來建立乙個自定義物件，當然es6中也引入了class來建立類。在這之前，我們需要使用js的原型來建立自定義物件。類繼承是在子型別建構函式的內部呼叫父型別的建構函式 function s...

JavaScript繼承的多種方式

1.原型鏈繼承 function a firstname a.prototype.getfirstname function function b lastname b.prototype newa 遠 b.prototype.getlastname function var person newb...