js構造物件

2021-07-28 00:13:28 字數 2666 閱讀 4355

js中定義類的方式有很多種: 

1、工廠方式 

function car(); 

return ocar; 

} var car1 = car(); 

var car2 = car(); 

呼叫此函式時將建立新物件,並賦予它所有的屬性和方法。使用此函式可以建立2個屬性完全相同的物件。當然我們可以通過給它傳遞引數來改版這種方式。 

function car(color,door); 

return ocar; 

} var car1 = car("red",4); 

var car2 = car("blue",4); 

car1.showcolor()  //output:"red" 

car2.showcolor()  //output:"blue" 

現在可以通過給函式傳遞不同的引數來得到具有不同值的物件。 

在前面的例子中,每次呼叫函式car(),都要建立showcolor(),意味著每個物件都有乙個自己的showcolor()方法。

但是事實上,每個物件鬥共享了同乙個函式。 

雖然可以在函式外定義方法,然後通過將函式的屬性指向該方法。 

function showcolor() 

function car() 

但是這樣看起來不像是函式的方法。 

2、建構函式方式 

建構函式方式同工廠方式一樣簡單,如下所示: 

function car(color,door); 

} var car1 = new car("red",4); 

var car2 = new car("blue",4); 

可以看到建構函式方式在函式內部沒有建立物件,是用this關鍵字。因為在呼叫建構函式時已經建立了物件,而在函式內部只能用this來訪問物件屬性。 

現在用new來建立物件,看起來像那麼回事了!但是它同工廠方式一樣。每次呼叫都會為物件建立自己的方法。 

3、原型方式 

該方式利用了物件的prototype屬性。首先用空函式建立類名,然後所有的屬性和方法都被賦予prototype屬性。 

function car() 

car.prototype.color = "red"; 

car.prototype.doors = 4; 

car.prototype.showcolor = function() 

var car1 = new car(); 

var car2 = new car(); 

在這段**中,首先定義了乙個空函式,然後通過prototype屬性來定義物件的屬性。呼叫該函式時,原型的所有屬性都會立即賦予要建立的物件,所有該函式的物件存放的都是指向showcolor()的指標,語法上看起來都屬於同乙個物件。 

但是這個函式沒有引數,不能通過傳遞引數來初始化屬性,必須要在物件建立後才能改變屬性的預設值。 

原型方式有個很嚴重的問題就是當屬性指向的是物件時,如陣列。 

function car() 

car.prototype.color = "red"; 

car.prototype.doors = 4; 

car.prototype.arr = new array("a","b"); 

car.prototype.showcolor = function() 

var car1 = new car(); 

var car2 = new car(); 

car1.arr.push("cc"); 

alert(car1.arr);  //output:aa,bb,cc 

alert(car2.arr);  //output:aa,bb,cc 

這裡由於陣列的引用值,car的兩個物件指向的都是同乙個陣列,所以當在car1新增值後,在car2中也可以看到。 

聯合是用建構函式/原型方式就可以像其他程式語言一樣建立物件,是用建構函式定義物件的非函式屬性,用原型方式定義物件的方法。 

function car(color,door) 

car.prototype.showcolor() 

var car1 = new car("red",4); 

var car2 = new car("blue",4); 

car1.arr.push("cc"); 

alert(car1.arr);  //output:aa,bb,cc 

alert(car2.arr);  //output:aa,bb 

5、動態原型方式 

動態原型的方式同混合的建構函式/原型方式原理相似。唯一的區別就是賦予物件方法的位置。 

function car(color,door); 

car._initialized = true; 

} } 

動態原型方式是使用乙個標誌來判斷是否已經給原型賦予了方法。這樣可以保證該方法只建立一次 

6、混合工廠方式 

它的目的師建立假建構函式,只返回另一種物件的新例項。 

function car(); 

return ocar; 

} 與工廠方式所不同的是,這種方式使用new運算子。 

以上就是全部的建立物件方法。目前使用最廣泛的就是混合建構函式/原型方式,此外,動態原型方式也很流行。在功能上與建構函式/原型方式等價。 

出處:平時收集,已忘出處,望原作見諒。

**:

js 物件導向 建構函式

面向過程的時候我們寫 的方式是獲取元素 定義訊號量 定義鎖都是遇見需求就定義乙個變數 但是 無法復用 並且主要就是定義的 是變數 物件導向就是操作的是物件 把寫 的風格從面向過程改為物件導向 把變數封裝成物件即可 面向過程 var username 王老五 var age 13 var 男 cons...

js 中物件和建構函式

物件 可以有屬性和方法 物件的建立方法 1 var obj 物件字面量 物件直接量 2 建構函式 2.1 系統自帶的函式 object array eg var obj new object 2.2 自定義要符合大駝峰式命名規則 function a var aa new a var first d...

JS物件導向 建構函式 繼承

繼承 子類繼承父類的屬性和方法 好處 減少 量,公共的父類可以復用.降低耦合度.js裡實現繼承的方法 1.通過改變構造建構函式中物件的指向實現繼承 2.通過原型鏈實現繼承.function animal function cat var cat new cat new出乙個例項改變呼叫物件的方法 1...