JS常用設計模式

單例模式

在執行當前 Single 只獲得唯一一個對象
單例模式,是一種常用的軟件設計模式。在它的核心結構中只包含一個被稱為單例的特殊類。通過單例模式可以保證系統中,應用該模式的一個類只有一個實例。即一個類只有一個對象實例。

<code>var Single = (function(){
var instance;
function init() {
// 定義私有方法和屬性
// 操作邏輯
return {
// 定義公共方法和屬性
};
}
return {
// 獲取實例
getInstance:function(){
if(!instance){
instance = init();
}
return instance;
}
}
})();

var obj1 = Single.getInstance();
var obj2 = Single.getInstance();
console.log(obj1 === obj2);/<code>

工廠模式

工廠模式是我們最常用的實例化對象模式了,是用工廠方法代替new操作的一種模式。
因為工廠模式就相當於創建實例對象的new,我們經常要根據類Class生成實例對象,如A a=new A() 工廠模式也是用來創建實例對象的,所以以後new時就要多個心眼,是否可以考慮使用工廠模式,雖然這樣做,可能多做一些工作,但會給你係統帶來更大的可擴展性和儘量少的修改量。

<code>function Animal(opts){
var obj = new Object();
obj.color = opts.color;
obj.name= opts.name;
obj.getInfo = function(){
return '名稱:'+ onj.name+', 顏色:'+ obj.color;
}
return obj;
}
var cat = Animal({name: '波斯貓', color: '白色'});
cat.getInfo();
/<code>


構造函數模式

  ECMAScript中的構造函數可用來創建特定類型的對象,像Array和Object這樣的原生構造函數,在運行時會自動出現在執行環境中。此外,也可以創建自定義的構造函數,從而定義自定義對象的屬性和方法。使用構造函數的方法,既解決了重複實例化的問題,又解決了對象識別的問題。

<code>function Animal(name, color){
this.name = name;
this.color = color;
this.getName = function(){
return this.name;
}
}
// 實例一個對象
var cat = new Animal('貓', '白色');
console.log( cat.getName() );/<code>

訂閱/發佈模式(subscribe & publish)


  text屬性變化了,set方法觸發了,但是文本節點的內容沒有變化。 如何才能讓同樣綁定到text的文本節點也同步變化呢? 這裡又有一個知識點: 訂閱發佈模式。
  訂閱發佈模式又稱為觀察者模式,定義了一種一對多的關係,讓多個觀察者同時監聽某一個主題對象,這個主題對象的狀態發生改變時就會通知所有的觀察者對象。
發佈者發出通知 =>主題對象收到通知並推送給訂閱者 => 訂閱者執行相應的操作。

<code> // 一個發佈者 publisher,功能就是負責發佈消息 - publish
var pub = {
publish: function () {
dep.notify();
}
}
// 多個訂閱者 subscribers, 在發佈者發佈消息之後執行函數
var sub1 = {
update: function () {
console.log(1);
}
}
var sub2 = {
update: function () {
console.log(2);
}
}
var sub3 = {
update: function () {
console.log(3);
}

}
// 一個主題對象
function Dep() {
this.subs = [sub1, sub2, sub3];
}
Dep.prototype.notify = function () {
this.subs.forEach(function (sub) {
sub.update();
});
}

// 發佈者發佈消息, 主題對象執行notify方法,進而觸發訂閱者執行Update方法
var dep = new Dep();
pub.publish();/<code>


思路: 發佈者負責發佈消息、 訂閱者負責接收接收消息,而最重要的是主題對象,他需要記錄所有的訂閱這特消息的人,然後負責吧發佈的消息通知給哪些訂閱了消息的人。

所以,當set方法觸發後做的第二件事情就是作為發佈者發出通知: “我是屬性text,我變了”。 文本節點作為訂閱者,在接收到消息之後執行相應的更新動作。


JS常用設計模式


分享到:


相關文章: