javascript 發(fā)布訂閱模式應(yīng)用

skinner 發(fā)布于2019-08-20 17:29 / 3400人閱讀

摘要：發(fā)布訂閱模式應(yīng)用場景需要用戶確定是否執(zhí)行該操作，才能決定代碼邏輯的下一步走向。

發(fā)布訂閱模式其實一直存在于javascript的編程思想中，javascript的事件管理機制，從某種意義上來說，就是一個發(fā)布訂閱模式。

發(fā)布訂閱模式的好處：

可以解決一些異步進行的代碼

就算不解決異步問題，也可以使代碼邏輯更清晰，更加具有結(jié)構(gòu)化。

發(fā)布訂閱模式應(yīng)用場景：

需要用戶確定是否執(zhí)行該操作，才能決定代碼邏輯的下一步走向。

為了使代碼更加結(jié)構(gòu)化，邏輯清晰，可以自定義事件，然后用類似于jquery中的$("main").trigger("eventName")的機制去觸發(fā)。

以下是一個簡單實用的發(fā)布訂閱模式的實現(xiàn)代碼：

//events - a super-basic Javascript (publish subscribe) pattern
var events = {
    events: {},
    on: function (eventName, fn) {
        this.events[eventName] = this.events[eventName] || [];
        this.events[eventName].push(fn);
    },
    off: function(eventName, fn) {
        if (this.events[eventName]) {
            for (var i = 0; i < this.events[eventName].length; i++) {
                if (this.events[eventName][i] === fn) {
                    this.events[eventName].splice(i, 1);
                    break;
                }
            };
        }
    },
    emit: function (eventName, data) {
        if (this.events[eventName]) {
            this.events[eventName].forEach(function(fn) {
                fn(data);
            });
        }
    }
};

用法如下：
on:綁定事件
off:取消綁定
emit:觸發(fā)事件

云服務(wù)器 GPU云服務(wù)器發(fā)布訂閱模式訂閱發(fā)布模式 DTS 訂閱發(fā)布模式訂閱模式

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/83620.html

相關(guān)文章

JavaScript 設(shè)計模式（六）：觀察者模式與發(fā)布訂閱模式

摘要：觀察者模式維護單一事件對應(yīng)多個依賴該事件的對象關(guān)系發(fā)布訂閱維護多個事件主題及依賴各事件主題的對象之間的關(guān)系觀察者模式是目標(biāo)對象直接觸發(fā)通知全部通知，觀察對象被迫接收通知。觀察者模式（Observer）觀察者模式：定義了對象間一種一對多的依賴關(guān)系，當(dāng)目標(biāo)對象 Subject 的狀態(tài)發(fā)生改變時，所有依賴它的對象 Observer 都會得到通知。簡單點：女神有男朋友了，朋友圈曬個圖，甜...

bingo 2019-08-23 18:36 評論0 收藏0
JavaScript 發(fā)布-訂閱模式

摘要：發(fā)布訂閱模式訂閱者把自己想訂閱的事件注冊到調(diào)度中心，當(dāng)發(fā)布者發(fā)布該事件到調(diào)度中心，也就是該事件觸發(fā)時，由調(diào)度中心統(tǒng)一調(diào)度訂閱者注冊到調(diào)度中心的處理代碼。發(fā)布-訂閱模式，看似陌生，其實不然。工作中經(jīng)常會用到，例如 Node.js EventEmitter 中的 on 和 emit 方法；Vue 中的 $on 和 $emit 方法。他們都使用了發(fā)布-訂閱模式，讓開發(fā)變得更加高效方便。一...

13651657101 2019-08-26 13:53 評論0 收藏0
Javascript（七）發(fā)布-訂閱模式

摘要：發(fā)布訂閱的作用發(fā)布訂閱模式可以廣泛應(yīng)用與異步編程中，這是一種替代傳統(tǒng)回調(diào)函數(shù)的方案。發(fā)布訂閱模式讓兩個對象松散耦合地聯(lián)系在一起，雖然不清楚彼此的細(xì)節(jié)，但不影響它們之間的通信。發(fā)布-訂閱模式又叫觀察者模式，它定義與對象間的一種一對多的關(guān)系，當(dāng)一個對象的狀態(tài)發(fā)生改變時，所有依賴與它的對象都將得到通知。發(fā)布訂閱的作用發(fā)布-訂閱模式可以廣泛應(yīng)用與異步編程中，這是一種替代傳統(tǒng)回調(diào)函數(shù)的...

megatron 2019-08-26 13:22 評論0 收藏0
簡單理解觀察者模式(pub/sub)在前端中的應(yīng)用

摘要：概念觀察者模式被廣泛地應(yīng)用于客戶端編程中。所有的瀏覽器事件，等都是使用觀察者模式的例子。在觀察者模式中，一個對象訂閱另一個對象的指定活動并得到通知，而不是調(diào)用另一個對象的方法。此外，觀察者模式還可用于實現(xiàn)數(shù)據(jù)綁定。概念觀察者模式被廣泛地應(yīng)用于JavaScript客戶端編程中。所有的瀏覽器事件（mouseover，keypress等）都是使用觀察者模式的例子。這種模式的另一個名字叫自...

guyan0319 2019-08-23 12:10 評論0 收藏0
設(shè)計模式之觀察者（發(fā)布/訂閱）模式

摘要：發(fā)布訂閱模式又叫觀察者模式，它定義對象間的一種一對多的依賴關(guān)系。事件觀察者模式應(yīng)該是最常用的模式之一。總之，當(dāng)消息一發(fā)布，所有的訂閱者都會收到消息。發(fā)布訂閱模式還可以用來幫助實現(xiàn)一些別的設(shè)計模式，比如中介者模式。發(fā)布/訂閱模式又叫觀察者模式，它定義對象間的一種一對多的依賴關(guān)系。當(dāng)一個對象的狀態(tài)（發(fā)布者）發(fā)生改變時，所有依賴于它的對象都將得到通知。在 JavaScript 開發(fā)中，我們...

dreamGong 2019-08-23 11:38 評論0 收藏0