您現(xiàn)在的位置： 365建站網(wǎng) > 365文章 > JavaScript中對(duì)象的構(gòu)造方法

JavaScript中對(duì)象的構(gòu)造方法

文章來(lái)源：365jz.com 點(diǎn)擊數(shù)：294 更新時(shí)間：2009-09-12 14:57 參與評(píng)論

第一種方式：工廠方法
能創(chuàng)建并返回特定類型的對(duì)象的工廠函數(shù)（factory function）。

Javascript代碼 
function createCar(sColor){  
  var oTempCar = new Object;  
  oTempCar.color = sColor;  
  oTempCar.showColor = function (){  
    alert(this.color);  
  };  
  return oTempCar;  
}  
var oCar1 = createCar();  
var oCar2 = createCar();  

調(diào)用此函數(shù)時(shí)，將創(chuàng)建新對(duì)象，并賦予它所有必要的屬性。使用此方法將創(chuàng)建car對(duì)象的兩個(gè)版本（oCar1和oCar2），他們的屬性完全一樣。
使用此方法存在的問(wèn)題：
1語(yǔ)義上看起來(lái)不像使用帶有構(gòu)造函數(shù)的new運(yùn)算符那么正規(guī)。
2使用這種方式必須創(chuàng)建對(duì)象的方法。每次調(diào)用createCar()，都要?jiǎng)?chuàng)建showColor()，意味著每個(gè)對(duì)象都有自己的showColor()版本，事實(shí)上，每個(gè)對(duì)象都共享了同一個(gè)函數(shù)。
有些開發(fā)者在工廠函數(shù)外定義對(duì)象的方法，然后通過(guò)屬性指向該方法。從而避免這個(gè)問(wèn)題：

Js代碼 
function createCar(sColor){  
  var oTempCar = new Object;  
  oTempCar.color = sColor;  
  oTempCar.showColor = showColor;  
  return oTempCar;  
}  
function showColor(){  
   alert(this.color);  
}  

在這段重寫的代碼中，在函數(shù)createCar()前定義了函數(shù)showColor().在createCar()內(nèi)部，賦予對(duì)象一個(gè)已經(jīng)指向已經(jīng)存在的showColor()函數(shù)的指針。從功能上來(lái)講，這樣解決了重復(fù)創(chuàng)建對(duì)象的問(wèn)題，但該函數(shù)看起來(lái)不像對(duì)象的方法。
所有這些問(wèn)題引發(fā)了開發(fā)者定義的構(gòu)造函數(shù)的出現(xiàn)。

第二種方式：構(gòu)造函數(shù)方式

Js代碼 
function Car(sColor){  
  this.color = sColor;  
  this.showColor = function (){  
    alert(this.color);  
  };  
}  
var oCar1 = new Car("red");  
var oCar2 = new Car("blue");  

你可能已經(jīng)注意到第一個(gè)差別了，在構(gòu)造函數(shù)內(nèi)部無(wú)創(chuàng)建對(duì)象，而是使用this關(guān)鍵字。使用new運(yùn)算符調(diào)用構(gòu)造函數(shù)時(shí)，在執(zhí)行第一行代碼前先創(chuàng)建一個(gè)對(duì)象，只有用this才能訪問(wèn)該對(duì)象。然后可以直接賦予this屬性，默認(rèn)情況下是構(gòu)造函數(shù)的返回值（不必明確使用return運(yùn)算符）。
這種方式在管理函數(shù)方面與工廠方法一樣都存在相同的問(wèn)題。

第三種方式：原型方式

Js代碼 
function Car(){  
   
}  
Car.prototype.color = "blue";  
var oCar1 = new Car();  
var oCar2 = new Car();  

調(diào)用new Car()時(shí)，原型的所有屬性都被立即賦予要?jiǎng)?chuàng)建的對(duì)象，意味著所有的Car實(shí)例存放的都是指向showColor()函數(shù)的指針。從語(yǔ)義上看起來(lái)都屬于一個(gè)對(duì)象，因此解決了前面兩種方式存在的兩個(gè)問(wèn)題。此外使用該方法，還能用instanceof運(yùn)算符檢查給定變量指向的對(duì)象類型。因此，下面的代碼將輸出true：
alert(oCar instanceof Car); //outputs "true"
這個(gè)方式看起來(lái)很不錯(cuò)，遺憾的是，它并不盡如人意。
1首先這個(gè)構(gòu)造函數(shù)沒(méi)有參數(shù)。使用原型方式時(shí)，不能給構(gòu)造函數(shù)傳遞參數(shù)初始化屬性的值，因?yàn)閏ar1和car2的屬性都等于“red”。
2真正的問(wèn)題出現(xiàn)在屬性指向的是對(duì)象，而不是函數(shù)時(shí)。函數(shù)共享不會(huì)造成任何問(wèn)題，但是對(duì)象卻很少被多個(gè)實(shí)例共享的。

第四種方式：混合的構(gòu)造函數(shù)/原型方式（推薦）
聯(lián)合使用構(gòu)造函數(shù)和原型方式，就可像用其他程序設(shè)計(jì)語(yǔ)言一樣創(chuàng)建對(duì)象。這種概念非常簡(jiǎn)單，即用構(gòu)造函數(shù)定義對(duì)象的所有非函數(shù)屬性，用原型方式定義對(duì)象的函數(shù)屬性（方法）。

Js代碼 
function Car(sColor){  
  this.color =sColor;  
  this.drivers =new Array("Mike","Sue");  
}  
Car.prototype.showColor = function(){  
  alert(this.color);  
}  
var oCar1 =new Car("red");  
var oCar2 =new Car("blue");  
  
oCar1.drivers.push("Matt");  
  
alert(oCar1.drivers);   //outputs "Mike,Sue,Matt"  
alert(oCar1.drivers);   //outputs "Mike,Sue"  

第五種方式：動(dòng)態(tài)原型方式（推薦）
對(duì)于習(xí)慣使用其他語(yǔ)言的開發(fā)者來(lái)說(shuō)，使用混合的構(gòu)造函數(shù)/原型方式感覺(jué)不那么和諧。批評(píng)混合的構(gòu)造函數(shù)/原型方式的人認(rèn)為，在構(gòu)造函數(shù)內(nèi)找屬性，在外部找方法的做法很不合理。所以他們?cè)O(shè)計(jì)了動(dòng)態(tài)原型方式，以提供更友好的編碼風(fēng)格。
動(dòng)態(tài)原型方法的基本想法與混合的構(gòu)造函數(shù)/原型方式相同，即在構(gòu)造函數(shù)內(nèi)定義非函數(shù)屬性，而函數(shù)屬性則利用原型屬性定義。唯一的區(qū)別是賦予對(duì)象方法的位置。下面是使用動(dòng)態(tài)原型方法重寫的Car類：

Js代碼 
function Car(sColor){  
  this.color =sColor;  
  this.drivers =new Array("Mike","Sue");  
  
  if(typeof Car._initialized == "undefined"){  
    Car.prototype.showColor = function(){  
      alert(this.color);  
    }  
  }  
  Car._initialized = true;  
}  