js五種設計模式說明與示例

第一種模式：js工廠模式

var lev=function();  

function parent();  

var  x = parent();  

alert(x.name);  

alert(x.lev());

說明：1.在函式中定義物件,並定義物件的各種屬性，,雖然屬性可以為方法，但是建議將屬性為方法的屬性定義到函式之外，這樣可以避免重複建立該方法

2.引用該物件的時候，這裡使用的是 var x = parent()而不是 var x = new parent();因為後者會可能出現很多問題（前者也成為工廠經典方式,後者稱之為混合工廠方式），不推薦使用new的方式使用該物件

3.在函式的最後返回該物件

4.不推薦使用這種方式建立物件，但應該了解

第二種模式：js建構函式模式

var lev=function();  

function parent();  

var  x =new  parent();  

alert(x.name);  

alert(x.lev());  

說明：1.與工廠方式相比，使用建構函式方式建立物件，無需再函式內部重建建立物件，而使用this指代，並而函式無需明確return

2.同工廠模式一樣，雖然屬性的值可以為方法，扔建議將該方法定義在函式之外

3..同樣的，不推薦使用這種方式建立物件，但仍需要了解

第三種模式：js原型模式

var lev=function();  

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.同樣的，不推薦使用這樣方式建立物件

第四種模式：建構函式+原型的js混合的模式（推薦）

function parent();

parent.prototype.lev=function();

var  x =new  parent();

alert(x.lev());

說明：1.該模式是指混合搭配使用建構函式方式和原型方式

2.將所有屬性不是方法的屬性定義在函式中（建構函式方式）

將所有屬性值為方法的屬性利用prototype在函式之外定義（原型方式）

3.推薦使用這樣方式建立物件,這樣做有好處和為什麼不單獨使用建構函式方式和原型方式，由於篇幅問題這裡不予討論

第五種模式：建構函式+原型的動態原型模式（推薦）

function parent()  

parent._lev=true;  

}  };   

var  x =new  parent();

alert(x.lev());  

說明：1.動態原型方式可以理解為混合建構函式，原型方式的乙個特例

2.該模式中,屬性為方法的屬性直接在函式中進行了定義，但是因為

if(typeof parent._lev=="undefined")

從而保證建立該物件的例項時，屬性的方法不會被重複建立

js五種設計模式說明與示例

var lev function function parent var x parent alert x.name alert x.lev 說明 1.在函式中定義物件,並定義物件的各種屬性，雖然屬性可以為方法，但是建議將屬性為方法的屬性定義到函式之外，這樣可以避免重複建立該方法 2.引用該物件的時...

五步讓你了解js五種設計模式（內含說明與示例）

第一種模式 js工廠模式 var lev function function parent var x parent alert x.name alert x.lev 說明 1.在函式中定義物件,並定義物件的各種屬性，雖然屬性可以為方法，但是建議將屬性為方法的屬性定義到函式之外，這樣可以避免重複建立...

Js 設計模式簡單示例（筆記）

function single age var createsingle function var a createsingle 12 console.log a single var b createsingle 13 console.log b single console.log a b tr...