js面向對象 多種創建對象方法小結
2024-05-06 14:22:02
供稿：網友
開始創建對象：
1.對象字面量。
代碼如下:
var clock={
hour:12,
minute:10,
second:10,
showTime:function(){
alert(this.hour+":"+this.minute+":"+this.second);
}
}
clock.showTime();//調用
2.創建Object實例
代碼如下:
var clock = new Object();
clock.hour=12;
clock.minute=10;
clock.showHour=function(){alert(clock.hour);};
clock.showHour();//調用
由此可見 屬性是可以動態添加，修改的
對象創建模式：
1.工廠模式：就是一個函數，然后放入參數，返回對象，流水線工作
代碼如下:
function createClock(hour,minute,second){
var clock = new Object();
clock.hour=hour;
clock.minute=minute;
clock.second=second;
clock.showHour=function(){
alert(this.hour+":"+this.minute+":"+this.second);
};
return clock;
};
var newClock = createClock(12,12,12);//實例化
newClock.showHour();//調用
優點：總算優點抽象的概念了。但是不能識別對象的類型呢！
2.構造函數模式
代碼如下:
function clock(hour,minute,second){
this.hour = hour;
this.minute = minute;
this.second = second;
this.showTime = function(){
alert(this.hour+":"+this.minute+":"+this.second);
}
}
var newClock =new clock(12,12,12);
alert(newClock.hour);
注意:這個new關鍵字是必須，如果不加，clock就不會當成構造函數調用，而只是一個普通的函數。同時，還會意外地給他的外部作用域即window添加屬性，因為此時構造函數內部的this已經映射到了外部作用域了。所以為了安全起見，可以這樣創建
代碼如下:
function clock(hour,minute,second){
if(this instanceof clock){
this.hour = hour;
this.minute = minute;
this.second = second;
this.showTime = function(){
alert(this.hour+":"+this.minute+":"+this.second);
}
}
else{
throw new Error("please add 'new' to make a instance");
}
}
構造函數的缺點：由于this指針在對象實例的時候發生改變指向新的實例。這時新實例的方法也要重新創建，如果n個實例就要n次重建相同的方法。于是讓我們來揭開原型模式吧
3.原型模式
代碼如下:
function clock(hour,minute,second){
}
clock.prototype.hour=12;
clock.prototype.minute=12;
clock.prototype.second=12;
clock.prototype.showTime=function(){
alert(this.hour+":"+this.minute+":"+this.second);
}
var newClock = new clock();
newClock.showTime();
深度理解原型模型很重要，
首先，每個函數都有一個prototype(原型)屬性，這個指針指向的就是clock.prototype對象。而這個原型對象在默認的時候有一個屬性constructor，指向clock，這個屬性可讀可寫。而當我們在實例化一個對象的時候，實例newClock除了具有構造函數定義的屬性和方法外（注意，只是構造函數中的）,還有一個指向構造函數的原型的指針，ECMAScript管他叫[[prototype]]，這樣實例化對象的時候，原型對象的方法并沒有在某個具體的實例中，因為原型沒有被實例。（廢話有點多，沒有誤導您吧。別暈）
