javascript繼承的實現方式介紹

作為物件導向的一門語言，繼承自然是javascript所比不可少的特性，下面就簡單介紹一下javascript實現繼承的幾種方式，希望能夠對需要的朋友帶來一定的幫助，下面進入正題。

一.物件冒充:

[JavaScript] 純文字檢視 複製程式碼
function A(){
  this.name="螞蟻部落";
  this.address="青島市南區";
}
function B(){
  this.target="提供免費的教程";
  this.newA=A;
  this.newA();
  delete this.newA;
}
var oB=new B();
console.log(oB.name);

以上程式碼程式碼可以輸出"螞蟻部落"，這說明A中的屬性已經被B繼承，下面簡單介紹一下實現原理。

建構函式也可以當做普通的函式使用，所以在建構函式B中呼叫函式A()可以將A中使用this定義的屬性全都整合到B中去，這樣就簡單的實現了我們需要的繼承。關於this的用法可以參閱JavaScript this一章節。

二.使用call()和appy()函式:

使用call()方法和appy()函式也可以實現繼承效果，程式碼如下:

[JavaScript] 純文字檢視 複製程式碼
function A(){
  this.name="螞蟻部落";
  this.address="青島市南區";
}
function B(){
  this.target="提供免費的教程";
  this.newA=A;
  this.newA();
  delete this.newA;
}
var oB=new B();
A.call(oB);
console.log(oB.name);

以上程式碼利用call函式同樣實現了繼承效果，這裡就不多介紹了，具體可以參閱javascript call()一章節。

三.原型鏈方式:

javascript的繼承是基於原型的，Prototype物件的任何屬性和方法都被傳遞給那個類的所有例項，通過原型一層層的繼承於是就形成了一個原型鏈，程式碼例項如下:

[JavaScript] 純文字檢視 複製程式碼
function A(){}
A.prototype.name="螞蟻部落"; 
A.prototype.address="青島市南區";
function B(){ 
} 
B.prototype=new A(); 
var oB=new B();
console.log(oB.name);

以上程式碼通過原型鏈方式同樣實現了繼承。