js發布訂閱模式

再開始之前先簡單介紹下訂閱-發布模式，因為這種設計模式在vue**中起到比較關鍵的作用。

首先，簡單來說訂閱-發布模式是一種定義一對多依賴關係的設計模式，當乙個物件狀態發生變化時候，所依賴於他的所有物件都將得到通知。

舉個簡單例子：很多學生到書店買書，a同學定了一本《js高程》，b同學定了一本《js設計模式》……，但是書店的好多書廠家還沒發貨，買書者不可能天天跑過去問書到了沒，這樣書店也應付不過來，買書者也耗費大量時間。所以一般這種情況，書店會留下買書者資訊，等書到了通知買書者就ok了。這個例子裡，買書者就充當訂閱者，書店就是發布者。

既然是訂閱-發布模式，那麼它應當具備以下特徵：

下面根據上面的特點來實現乙個最簡單的發布訂閱模式 :

// 建立乙個發布者
const publisher = {};
//發布者儲存訂閱者資訊的物件
const informations = {}
//給發布者賦予監聽訂閱者和它需要資訊的能力，sbuscriber_key--訂閱者標識，fn--訂閱者需要的資訊或者服務
publisher.listen = (sbuscriber_key,fn) => 
informations[sbuscriber_key].push(fn);    
}//給發布者賦予通知所有訂閱者資訊的能力
publisher.inform = (sbuscriber_key,...arg) => 
informations[sbuscriber_key].foreach(fn => );
}publisher.listen('a',bookname => ) //a訂閱一本書
publisher.listen('b',(bookname,price) => ) //b訂閱一本書
//書到了，發布者通知訂閱者
publisher.inform('a','js高程')        //js高程---到了可以過來取了
publisher.inform('b','js設計模式',50) //js設計模式---到了，**50是否還要

上面的例子裡，比如b同學要到很多書店買書看哪個書店到貨了，最後要確切知道去哪個書店買書，造成了b同學和書店的耦合，所以這時候班級統一找乙個人c登記每個人要賣的書。買書的不用知道去哪個書店買的，書店也不需要知道賣給誰了，統一由c**，這樣c就是該事件的發布者，根據第乙個**實現，把發布者做乙個通用實現：

function publisher()
}publisher.prototype = 
this.informations[sbuscriber_key].foreach(fn => )
console.log(this)
},listen: function (sbuscriber_key,fn)
this.informations[sbuscriber_key].push(fn);    
},remove:function (sbuscriber_key)
this.informations[sbuscriber_key].length = 0;
}}const p = new publisher();
p.listen('a',bookname => ) 
p.listen('b',(bookname,price) => ) 
p.inform('a','js高程')        
p.inform('b','js設計模式',50)

給出通用建構函式pulisher

js發布訂閱模式

js發布訂閱者模式

js 發布訂閱者模式

js設計模式發布訂閱模式

js發布訂閱模式

js發布訂閱者模式

js 發布 訂閱者模式

js設計模式 發布訂閱模式

相關推薦

js 發布訂閱者模式

js設計模式發布訂閱模式