js建立對象的幾種常用方式小結

來源:互聯網
上載者:User

標籤:方式   type屬性   建構函式   text   pointer   建議   理解   利用   動態原型   

第一種模式:工廠方式

複製代碼 代碼如下:
var lev=function(){
return "指令碼之家";
};
function Parent(){
var Child = new Object();
Child.name="指令碼";
Child.age="4";
Child.lev=lev;
return Child;
};
var x = Parent();
alert(x.name);
alert(x.lev());


說明:
1.在函數中定義對象,並定義對象的各種屬性,,雖然屬性可以為方法,但是建議將屬性為方法的屬性定義到函數之外,這樣可以避免重複建立該方法
2.引用該對象的時候,這裡使用的是 var x = Parent()而不是 var x = new Parent();因為後者會可能出現很多問題(前者也成為工廠經典方式,後者稱之為混合工廠方式),不推薦使用new的方式使用該對象
3.在函數的最後返回該對象
4.不推薦使用這種方式建立對象,但應該瞭解
第二種模式:建構函式方式

複製代碼 代碼如下:
var lev=function(){
return "指令碼之家";
};
function Parent(){
this.name="指令碼";
this.age="30";
this.lev=lev;
};
var x =new Parent();
alert(x.name);
alert(x.lev());


說明:
1.與工廠方式相比,使用建構函式方式建立對象,無需再函數內部重建建立對象,而使用this指代,並而函數無需明確return
2.同原廠模式一樣,雖然屬性的值可以為方法,扔建議將該方法定義在函數之外
3..同樣的,不推薦使用這種方式建立對象,但仍需要瞭解
第三種模式:原型模式

複製代碼 代碼如下:
var lev=function(){
return "指令碼之家";
};
function Parent(){

};
Parent.prototype.name="李小龍";
Parent.prototype.age="30";
Parent.prototype.lev=lev;
var x =new Parent();
alert(x.name);
alert(x.lev());


說明:
1.函數中不對屬性進行定義
2.利用prototype屬性對屬性進行定義
3.同樣的,不推薦使用這樣方式建立對象
第四種模式:混合的建構函式,原型方式(推薦)

複製代碼 代碼如下:
function Parent(){
this.name="指令碼";
this.age=4;
};
Parent.prototype.lev=function(){
return this.name;
};;
var x =new Parent();
alert(x.lev());


說明:1.該模式是指混合搭配使用建構函式方式和原型方式
2.將所有屬性不是方法的屬性定義在函數中(建構函式方式)
將所有屬性值為方法的屬性利用prototype在函數之外定義(原型方式)
3.推薦使用這樣方式建立對象,這樣做有好處和為什麼不單獨使用建構函式方式和原型方式,由於篇幅問題這裡不予討論
第五種模式:動態原型方式

複製代碼 代碼如下:
function Parent(){
this.name="指令碼";
this.age=4;

if(typeof Parent._lev=="undefined"){

Parent.prototype.lev=function(){
return this.name;
}
Parent._lev=true;
}
};

var x =new Parent();
alert(x.lev());


說明:
1.動態原型方式可以理解為混合建構函式,原型方式的一個特例
2.該模式中,屬性為方法的屬性直接在函數中進行了定義,但是因為

複製代碼 代碼如下:
if(typeof Parent._lev=="undefined"){

Parent._lev=true;}


從而保證建立該對象的執行個體時,屬性的方法不會被重複建立
3.,推薦使用這種模式

js建立對象的幾種常用方式小結

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.