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

2021-09-24 12:59:42 字數 1727 閱讀 2365

第一種模式: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());

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.該模式中,屬性為方法的屬性直接在函式中進行了定義,但是因為

五步讓你成為SEO高手

1 分析競爭對手,做好 關鍵詞選擇我們做 優化說白了其實就是權衡 各方面的因素做好關鍵詞排名使用者體驗,關鍵詞就好比是貫穿於整個 優化過程中的一條主線,選擇好的關鍵詞可以起到事半功倍的效果,選擇 關鍵詞首先就是要避免出現違法字眼和搜素引擎所顧忌的詞語,其次就是看關鍵詞的搜尋量和競爭力的大小,因為做這...

了解設計的五種視角

一位國外著名的設計師曾經到一家南韓餐廳吃飯,這位設計師不經意地發現在烤肉桌面上挖的大洞,就不禁稱讚這是個 好設計 good design 對於我們南韓人來講,這種平凡的烤肉桌是再熟悉不過的了,但是,它的確是已經充分融入到我們日常生活中的一種 設計 在德國,人們把設計稱為一種 科學 在義大利,人們稱其...

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

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