js 建立物件的9種方式對比
阿新 • • 發佈:2019-02-20
@建立物件
##原生建立方法
new func();
{};
##工廠模式
優點:原生建立方法的封裝。
缺點:物件型別不可知。
function createFunc(args){… return obj;}
var obj=createFunc(args)
##建構函式模式
優點:物件型別可知(instanceof,obj.constructor)
缺點:構造了多個相同功能的方法。(可以通過this.func=window.func,但這樣函式變全域性,失去封裝性)
function Func(args){this.prop…} var obj=new Func(args); || Func.call(obj,args); || Func(args) window.prop;…
##原型模式
優點:解決了建構函式缺點
缺點:預設屬性相同,原型的引用型屬性有坑,一個變全都變。
function Func(){} Func.prototype.prop… //Func.prototype={,…} Object.defineProperty(Func.prototype,constructor,{enumerable:false,value:Func}) 重寫原型更常用,但需在建立例項前定義原型,否則有坑
var obj=new Func();
##構造原型模式結合
優點:結合構造原型兩家之長
缺點:不突出原型程式設計泛型的特點。
例項屬性用構造,方法和共享屬性用原型。
##原型克隆模式(推薦)
優點:顯現出原型程式設計泛型的特點。《單頁web應用》p38
缺點:
var proto={};function makeFunc(){varobj=Object.create(proto);obj.prop=…; return obj;}
var obj=makeFunc();
不支援object.create()的瀏覽器可js實現。
##動態原型構造
優點:和其他OO語言更接近。
缺點:不突出原型模式特點。
建構函式中動態初始化原型。
function Func(){this.prop=…;if(typeofthis.func!='function'){Func.prototype=function(){}} }; var obj=new Func();
確保原型方法只定義一次,if檢測只需一次。(若重寫原型會切斷與原有例項的聯絡,原型模式同坑)
##寄生式構造
優點:可用於構造方法的重構。
缺點:物件型別不可知,此法少用。
function NewFunc(){var obj=new Func();obj.prop=…;return obj;}
var obj=new NewFunc();
##穩妥建構函式模式(不用this不用new)
優點:專用於安全執行環境,建構函式的變數只能通過get函式來獲取。
缺點:物件型別不可知
function Func(){var obj=new Object();var_prop;obj.getProp(){};return obj; }
var obj=Func();
和工廠方法的區別在於變數私有,只能通過閉包訪問。保證了安全性。