在javascript中定義類別或物件有以下幾種常用的方式: 工廠方式
function createCar(color, doors, mpg){
var tempCar = new Object;
tempCar.color = color;
tempCar.doors = doors;
tempCar.mpg = mpg;
tempCar.showColor = function (){
alert( this .color);
};
return tempCar;
}
var car1 = createCar("red", 4, 23);
var car2 = createCar("blue", 3, 25);
car1.showColor();
car2.showColor();
定義了一個能建立並傳回特定類型物件的工廠函數,看起來還是不錯的,但有個小問題,每次呼叫時都要建立新函數showColor,我們可以把它移到函數外面, function showColor(){ alert(this.color); } 在工廠函數中直接指向它 tempCar.showColor = showColor; 這樣避免了重複建立函數的問題,但看起來不像物件的方法了。 建構函數方式
function Car(sColor, iDoors, iMpg){
this .color = sColor;
this .doors = iDoors;
this .mpg = iMpg;
this .showColor = function (){
alert( this .color);
};
}
var car1 = new Car("red", 4, 23);
var car2 = new Car("blue", 3, 25);
car1.showColor();
car2.showColor();
可以看到與第一中方式的差別,在建構函數內部無創建對象,而是使用this 關鍵字。使用new 呼叫建構函數時,先建立了一個對象,然後用this來存取。 這種用法於其他物件導向語言很相似了,但這種方式和上一種有同一個問題,就是重複建立函數。 構混合的建構子/原型方式
這種方式就是同時使用構造函數方式和原型方式,綜合他們的優點,構造函數方式前面介紹過了,現在看一下原型方式 function Car(){
}
Car.prototype.color = "red";
Car.prototype.doors = 4;
Car.prototype.mpg = 23;
Car.prototype.showColor = function (){
alert( this .color);
};
var car1 = new Car();
var car2 = new Car();
首先定義了建構函式Car,但無任何程式碼,然後透過prototype 新增屬性 優點: a. 所有實例存放的都是指向showColor 的指針,解決了重複建立函數的問題 b. 可以用instanceof 檢查物件類型 alert(car1 instanceof Car); //true 缺點,加入下面的程式碼:
Car.prototype.drivers = new Array("mike", "sue");
car1.drivers.push("matt");
alert(car1.drivers); //outputs "mike,sue,matt"
alert(car2.drivers); //outputs "mike,sue,matt"
drivers是指向Array物件的指針,Car的兩個實例都指向同一個陣列。
下面就用一下混合方式: function Car(sColor, iDoors, iMpg){
this .color = sColor;
this .doors = iDoors;
this .mpg = iMpg;
this .drivers = new Array("mike", "sue");
}
Car.prototype.showColor = function (){
alert( this .color);
};
var car1 = new Car("red", 4, 23);
var car2 = new Car("blue", 3, 25);
car1.drivers.push("matt");
alert(car1.drivers);
alert(car2.drivers);
這樣就沒有問題了,而且還可以使用instanceof 動態原型法
function Car(sColor, iDoors, iMpg){
this .color = sColor;
this .doors = iDoors;
this .mpg = iMpg;
this .drivers = new Array("mike", "sue");
if ( typeof Car.initialized == "undefined"){
Car.prototype.showColor = function (){
alert( this .color);
};
Car.initialized = true ;
}
}
var car1 = new Car("red", 4, 23);
var car2 = new Car("blue", 3, 25);
car1.drivers.push("matt");
alert(car1.drivers);
alert(car2.drivers);
這種方式是我最喜歡的,所有的類別定義都在一個函數中完成,看起來非常像其他語言的類別定義,不會重複建立函數,還可以用instanceof