這一次我們深入的學(xué)習(xí)一下JavaScript面向?qū)ο蠹夹g(shù)，在學(xué)習(xí)之前，必要的說(shuō)明一下一些面向?qū)ο蟮囊恍┬g(shù)語(yǔ)。這也是所有面對(duì)對(duì)象語(yǔ)言所擁有的共同點(diǎn)。有這樣幾個(gè)面向?qū)ο笮g(shù)語(yǔ)：
一、對(duì)象
       ECMA-262把對(duì)象(object)定義為“屬性的無(wú)序集合，每個(gè)屬性存放一個(gè)原始值、對(duì)象或函數(shù)”。嚴(yán)格來(lái)說(shuō)，這意味著對(duì)象是無(wú)特定順序的值的數(shù)組。盡管ECMAScript如此定義對(duì)象，但它更通用的定義是基于代碼的名詞(人、地點(diǎn)或事物)的表示。
二、類(lèi)
       每個(gè)對(duì)象都由類(lèi)定義，可以把類(lèi)看做對(duì)象的配方。類(lèi)不僅要定義對(duì)象的接口(interface)(開(kāi)發(fā)者訪(fǎng)問(wèn)的屬性和方法)，還要定義對(duì)象的內(nèi)部工作（使屬性和方法發(fā)揮作用的代碼）。編譯器和解釋程序都根據(jù)類(lèi)的說(shuō)明構(gòu)建對(duì)象。
三、實(shí)例
       程序使用類(lèi)創(chuàng)建對(duì)象時(shí)，生成的對(duì)象叫作類(lèi)的實(shí)例（instance）。對(duì)類(lèi)生成的對(duì)象的個(gè)數(shù)的唯一限制來(lái)自于運(yùn)行代碼的機(jī)器的物理內(nèi)存。每個(gè)實(shí)例的行為相同，但實(shí)例處理一組獨(dú)立的數(shù)據(jù)。由類(lèi)創(chuàng)建對(duì)象實(shí)例的過(guò)程叫做實(shí)例化(instantiation)。
       在前面的章節(jié)我們提到過(guò)，ECMAScript并沒(méi)有正式的類(lèi)。相反，ECMA-262把對(duì)象定義描述為對(duì)象的配方。這是 ECMAScript邏輯上的一種折中方案，因?yàn)閷?duì)象定義實(shí)際上是對(duì)象自身。即使類(lèi)并不真正存在，我們也把對(duì)象定義叫做類(lèi)，因?yàn)榇蠖鄶?shù)開(kāi)發(fā)者對(duì)此術(shù)語(yǔ)更熟悉，而且從功能上說(shuō)，兩者是等價(jià)的。
       使用預(yù)定義對(duì)象只是面向?qū)ο笳Z(yǔ)言的能力的一部分，它真正強(qiáng)大之處在于能夠創(chuàng)建自己專(zhuān)用的對(duì)象。ECMAScript 擁有很多創(chuàng)建對(duì)象的方法。
1、原始方式
       因?yàn)閷?duì)象的屬性可以在對(duì)象創(chuàng)建后動(dòng)態(tài)定義，所有許多開(kāi)發(fā)者都在JavaScript 最初引入時(shí)編寫(xiě)類(lèi)似下面的代碼：

var Car = new Object(); Car.color = "blue"; Car.doors = 4; Car.mpg = 25; Car.showColor = function() {   return this.color; }; document.write(Car.showColor());//輸出：blue 

       在上面的代碼中，創(chuàng)建對(duì)象Car。然后給它設(shè)置幾個(gè)屬性：它的顏色是藍(lán)色，有四個(gè)門(mén)，每加侖油可以跑 25 英里。最后一個(gè)屬性實(shí)際上是指向函數(shù)的指針，意味著該屬性是個(gè)方法。執(zhí)行這段代碼后，就可以使用對(duì)象Car。不過(guò)這里有一個(gè)問(wèn)題，就是可能需要?jiǎng)?chuàng)建多個(gè)Car的實(shí)例，這樣就造成了我們會(huì)重復(fù)許多類(lèi)似的代碼，這樣會(huì)很麻煩。
2、工廠(chǎng)方式
       要解上述的多個(gè)類(lèi)似對(duì)象聲明的問(wèn)題，開(kāi)發(fā)者創(chuàng)造了能創(chuàng)建并返回特定類(lèi)型的對(duì)象的工廠(chǎng)方式。這種方式就是為了解決實(shí)例化對(duì)象產(chǎn)生大量重復(fù)的問(wèn)題。
(1)無(wú)參數(shù)的工廠(chǎng)方式
       例如，函數(shù)createCar()可用于封裝前面列出的創(chuàng)建Car對(duì)象的操作：

function createCar() { var TempCar = new Object(); TempCar.color = "blue"; TempCar.doors = 4; TempCar.mpg = 25; TempCar.showColor = function() {     return this.color;  };  return TempCar; }; var Car1 = createCar(); var Car2 = createCar(); document.write(Car1.showColor()+"<br/>");//輸出：blue document.write(Car2.showColor());//輸出：blue 

       在這里，第一個(gè)例子中的所有代碼都包含在createCar()函數(shù)中。此外，還有一行額外的代碼，返回TempCar 對(duì)象作為函數(shù)值。調(diào)用此函數(shù)，將創(chuàng)建新對(duì)象，并賦予它所有必要的屬性，復(fù)制出一個(gè)我們?cè)谇懊嬲f(shuō)明過(guò)的Car對(duì)象。因此，通過(guò)這種方法，我們可以很容易地創(chuàng)建Car對(duì)象的兩個(gè)版本(Car1和 Car2)，它們的屬性完全一樣。
(2)有參數(shù)的工廠(chǎng)方式
       我們還可以修改createCar()函數(shù)，給它傳遞各個(gè)屬性的默認(rèn)值，而不是簡(jiǎn)單地賦予屬性默認(rèn)值：

function createCar(Color,Doors,Mpg) {  var TempCar = new Object();  TempCar.color = Color;  TempCar.doors = Doors;  TempCar.mpg = Mpg;  TempCar.showColor = function() {     return this.color;  };  return TempCar; }; var Car1 = createCar("red",4,23); var Car2 = createCar("blue",3,25); document.write(Car1.showColor()+"<br/>");//輸出：red document.write(Car2.showColor());//輸出：blue 

       給createCar()函數(shù)加上參數(shù)，即可為要?jiǎng)?chuàng)建的Car對(duì)象的color、doors 和mpg屬性賦值。這使兩個(gè)對(duì)象具有相同的屬性，卻有不同的屬性值。
       工廠(chǎng)方式解決了重復(fù)實(shí)例化的問(wèn)題，但是還是有一個(gè)問(wèn)題，那就是前面的例子中，每次調(diào)用函數(shù)createCar()，都要?jiǎng)?chuàng)建新函數(shù)showColor()，意味著每個(gè)對(duì)象都有自己的 showColor() 版本。而事實(shí)上，每個(gè)對(duì)象都共享同一個(gè)函數(shù)。有些開(kāi)發(fā)者在工廠(chǎng)函數(shù)外定義對(duì)象的方法，然后通過(guò)屬性指向該方法，從而避免這個(gè)問(wèn)題：

function showColor() {    return this.color; }; function createCar(Color,Doors,Mpg) {  var TempCar = new Object();  TempCar.color = Color;  TempCar.doors = Doors;  TempCar.mpg = Mpg;  TempCar.showColor = showColor;  return TempCar; }; var Car1 = createCar("red",4,23); var Car2 = createCar("blue",3,25); document.write(Car1.showColor()+"<br/>");//輸出：red document.write(Car2.showColor());//輸出：blue 

       在上面這段重寫(xiě)的代碼中，在函數(shù) createCar()之前定義了函數(shù) showColor()。在createCar()內(nèi)部，賦予對(duì)象一個(gè)指向已經(jīng)存在的 showColor() 函數(shù)的指針。從功能上講，這樣解決了重復(fù)創(chuàng)建函數(shù)對(duì)象的問(wèn)題；但是從語(yǔ)義上講，該函數(shù)不太像是對(duì)象的方法。所有這些問(wèn)題都引發(fā)了開(kāi)發(fā)者定義的構(gòu)造函數(shù)的出現(xiàn)。
3、構(gòu)造函數(shù)方式
       創(chuàng)建構(gòu)造函數(shù)就像創(chuàng)建工廠(chǎng)方式的函數(shù)一樣容易。第一步選擇構(gòu)造函數(shù)的名字。根據(jù)慣例，這個(gè)名字的首字母大寫(xiě)，以使它與首字母通常是小寫(xiě)的變量名分開(kāi)。除了這點(diǎn)不同，構(gòu)造函數(shù)看起來(lái)很像工廠(chǎng)方式的函數(shù)。請(qǐng)看下面的例子：

function Car(Color,Doors,Mpg) {  this.color = Color;  this.doors = Doors;  this.mpg = Mpg;  this.showColor = function() {     return this.color;  }; }; var Car1 = new Car("red",4,23); var Car2 = new Car("blue",3,25); document.write(Car1.showColor()+"<br/>");//輸出：red document.write(Car2.showColor());//輸出：blue 

       下面為您解釋上面的代碼與工廠(chǎng)方式的差別。首先在構(gòu)造函數(shù)內(nèi)沒(méi)有創(chuàng)建對(duì)象，而是使用this關(guān)鍵字。使用new運(yùn)算符構(gòu)造函數(shù)時(shí)，在執(zhí)行第一行代碼前先創(chuàng)建一個(gè)對(duì)象，只有用this才能訪(fǎng)問(wèn)該對(duì)象。然后可以直接賦予this屬性，默認(rèn)情況下是構(gòu)造函數(shù)的返回值（不必明確使用 return 運(yùn)算符）。現(xiàn)在，用new運(yùn)算符和對(duì)象名Car創(chuàng)建對(duì)象，就更像 ECMAScript 中一般對(duì)象的創(chuàng)建方式了。
      就像工廠(chǎng)方式的函數(shù)，構(gòu)造函數(shù)會(huì)重復(fù)生成函數(shù)，為每個(gè)對(duì)象都創(chuàng)建獨(dú)立的函數(shù)版本。不過(guò)，與工廠(chǎng)方式的函數(shù)相似，也可以用外部函數(shù)重寫(xiě)構(gòu)造函數(shù)，同樣地，這么做語(yǔ)義上無(wú)任何意義。這正是下面要講的原型方式的優(yōu)勢(shì)所在。在下篇文章中會(huì)詳細(xì)的分析面向?qū)ο蟮脑头绞揭约捌渌C合的方式。

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)javascript程序設(shè)計(jì)有所幫助。