怎麼使用javascript實作類別的功能

經過前段時間，學習《ajax完全自學手冊》後，才知道javascript原來還可以這麼寫。

 學過java,c#,vb的都知道類的概念，而類具有繼承、封裝、多態等功能。而javascript它不是物件導向語言，它是解釋性語言。

但我們同樣可以使用javascript來實現繼承、多態。

 javascript實作類別，有多種方法。

  

方法一：構造方法。

代碼

function coder(){   
this.name = '小王';
this.job = '程式員';   
this.coding = function ()        
    {            
    alert('我正在寫代碼');
    }
}

var coder=new coder();     
alert(coder.name);   
coder.coding();

 

 方法二：Factory 方法。

代碼

function createCoderFactory(){
var obj=new Object();
obj.name = '小王';
obj.job = '程式員';
obj.coding = function (){
      alert('我正在寫代碼');
};
return obj;
}
var coder = createCoderFactory();
alert(coder.name);
coder.coding();

  但Factory 方法和構造方法都有著一個相同的缺點，就是每建立一個執行個體，都會執行個體化該類的每個函數。 

 方法三：原形鏈。

代碼

function coder(){}
coder.prototype.name = '小王';
coder.prototype.job = '程式員';
coder.prototype.coding = function(){   
    alert('我正在寫代碼');
};
var coder = new coder();      
alert(coder.name);     
coder.coding();

注意：書上說：原型鏈有個缺點就是它所有屬性都共用,只要一個執行個體改變其他的都會跟著改變。 測試如下：

var coder1 = new coder();
var coder2 = new coder();
alert(coder1.name); /*顯示“小王”*/
coder2.name = '老王';
alert(coder1.name); /*這個顯示“小王”     如果按書上說的應該是顯示"老王"*/
alert(coder2.name); /*這個顯示“老王”*/

alert(coder1.name);如果按書上說的應該是顯示"老王",但這裡顯示的是“小王”，所以書上出錯了。

  

方法四：混合方式。

 以上三種都有著各自的缺點，所以我們要加以改進。

function coder(){    
this.name = '小王';   
this.job = '程式員';
}
coder.prototype.coding = function(){        
alert('我正在寫代碼');
};

 

方法五：動態原鏈。

要解決前三種的缺點，還有一種方法。

代碼

function coder(){    
this.name = '小王';    
this.job = '程式員';    
if (typeof(coder._init) == 'undefined'){
this.coding = function ()        
    {        
        alert('我正在寫代碼');                     
    };                     
this._init = true;                 
  }
}

  這個方法呢，當第一次使用時，由於_init沒初始化，就會執行以下的代碼，執行個體化coding函數。以後就不會再執行，這樣就只執行個體化函數一次。