首頁  >  文章  >  web前端  >  JavaScript中發佈/訂閱模式的簡單實例_javascript技巧

JavaScript中發佈/訂閱模式的簡單實例_javascript技巧

WBOY
WBOY原創
2016-05-16 16:32:081230瀏覽

上次研究觀察者模式,很多文章說它也叫Subscribe/Publish(發布/訂閱模式)。但在《Javascript設計模式》一書中,這兩種模式還是有些差別的。書中原話如下:

1.Observer模式要求希望接收到主題通知者的觀察者必須訂閱內容改變的事件。

2.Subscribe/Publish模式使用了一個主題/事件通道,這個通道介於訂閱者和發布者之間。此事件系統允許程式碼定義應用程式的特定事件,該事件可以傳遞自訂參數,自訂參數包含訂閱者所需的值。其目的是避免訂閱者和發布者產生依賴關係。

與Observer模式不同之處在於它允許任何訂閱者執行適當的事件處理程序來註冊和接收發布者發出的通知。

好吧,不明覺厲。以下是我的理解:

1.觀察者模式中,目標物負責維護觀察者。發布/訂閱模式中發布者不關心訂閱者,只負責把消息丟出去就不管了。

2.觀察者模式中,觀察者要提供一個接口,然後當目標對象改變時調用此接口使自身狀態和目標狀態保持一致。即所有的觀察者都要有一個統一的介面(例如上文中寫的update方法,大家的方法都要叫這個名字)。而發布/訂閱模式中,訂閱者事件的觸發不是依靠這樣一個接口,而是訂閱者透過監聽一個特定的消息(這個消息一般包含名稱和訂閱者所需要的參數)來觸發的。可以理解為訂閱者監聽的不是發布者,而是消息池,只要消息池裡有它關心的消息,即觸發事件,不管這個消息是誰發布過去的。發布者和訂閱者是解耦的。

以下是js中發布/訂閱模式的實現,複製貼上到console裡面試一試就明白了:

複製程式碼 程式碼如下:

var pubsub = (function(){
    var q = {}
        topics = {},
        subUid = -1;
    //發佈訊息
    q.publish = function(topic, args) {
        if(!topics[topic]) {return;}
        var subs = topics[topic],
            len = subs.length;
        while(len--) {
            subs[len].func(topic, args);
        }
        return this;
    };
    //訂閱事件
    q.subscribe = function(topic, func) {
        topics[topic] = topics[topic] ? topics[topic] : [];
        var token = ( subUid).toString();
        topics[topic].push({
            token : token,
            func : func
        });
        return token;
    };
    return q;
    //取消訂閱就不寫了,遍歷topics,然後透過儲存前面返回token,刪除指定元素
})();
//觸發的事件
var logmsg = function(topics, data) {
    console.log("logging:" topics ":" data);
}
//監聽指定的訊息'msgName'
var sub = pubsub.subscribe('msgName', logmsg);
//發布訊息'msgName'
pubsub.publish('msgName', 'hello world');
//發佈無人監聽的訊息'msgName1'
pubsub.publish('anotherMsgName', 'me too!');
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn