JS設(shè)計(jì)模式——發(fā)布訂閱模式

shiyang6017 發(fā)布于2019-08-23 11:30 / 2789人閱讀

摘要：發(fā)布訂閱模式該模式大多數(shù)用于自定義事件通用代碼分析這里其中關(guān)鍵的一點(diǎn)就是利用對(duì)象鍵值對(duì)存儲(chǔ)了事件，在某個(gè)事件調(diào)用存儲(chǔ)的事件，移除事件也是通過(guò)對(duì)對(duì)象重新賦值。

發(fā)布訂閱模式

該模式大多數(shù)用于自定義事件

1. 通用代碼

var event = {}
event.cacheList = {}
event.on = function (key, fn) {
    if (!event.cacheList[key]) {
        event.cacheList[key] = []
    }
    event.cacheList[key].push(fn)
}
event.fire = function () {
    var key = Array.prototype.shift.apply(arguments)
    var fns = event.cacheList[key]
    if (!fns || fns.length === 0) {
        return false
    }
    for (var i = 0, len = fns.length; i < len; i++) {
        fns[i].apply(this, arguments)
    }
}
event.remove = function (key, fn) {
    var fns = event.cacheList[key]
    if (!fns || fns.length === 0) {
        return false
    }
    if (!fn) {
        fns && (fns.length = 0)
    } else {
        for (var i = 0, len = fns.length; i < len; i++) {
            if (fns[i] === fn) {
                fns.splice(i, 1)
            }
        }
    }
}
var installEvent = function (obj) {
    for (var key in event) {
        obj[key] = event[key]
    }
}
var sellOffice = {}
installEvent(sellOffice)
sellOffice.on("square200", function () {
    console.log("square200")
})
sellOffice.on("square200", function () {

    console.log("square200 2")
})
sellOffice.fire("square200")
sellOffice.remove("square200")
sellOffice.fire("square200")

2.分析

這里其中關(guān)鍵的一點(diǎn)就是利用對(duì)象鍵值對(duì)存儲(chǔ)了事件，在某個(gè)事件調(diào)用存儲(chǔ)的事件，移除事件也是通過(guò)對(duì)對(duì)象重新賦值。這里使用對(duì)象作為存儲(chǔ)的數(shù)據(jù)格式是因?yàn)橥ㄟ^(guò)鍵查詢的復(fù)雜度是1，可以快速搜索到某個(gè)鍵存儲(chǔ)的函數(shù)列表。

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

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

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/97062.html

相關(guān)文章

10分鐘弄懂一種簡(jiǎn)單的js設(shè)計(jì)模式（觀察者/發(fā)布訂閱）

摘要：發(fā)布者注冊(cè)發(fā)布訂閱者自動(dòng)打印消息消息觀察者模式與發(fā)布訂閱模式類似。在此種模式中，一個(gè)目標(biāo)物件在它本身的狀態(tài)改變時(shí)主動(dòng)發(fā)出通知，觀察者收到通知從而使他們的狀態(tài)自動(dòng)發(fā)生變化。做為非科班出身的前端er，每次聽(tīng)到設(shè)計(jì)模式都感覺(jué)很高大上，總感覺(jué)這些東西是造火箭原子彈用的，距離我們這些造螺絲釘很遙遠(yuǎn)。但是最近在做一個(gè)聊天消息的業(yè)務(wù)時(shí)，發(fā)現(xiàn)貌似用上發(fā)布訂閱模式業(yè)務(wù)就很清晰了。創(chuàng)建一個(gè)消息類當(dāng)作發(fā)布...

xiguadada 2019-08-26 10:13 評(píng)論0 收藏0
JS每日一題:設(shè)計(jì)模式-如何理解觀察者(發(fā)布訂閱)模式?

摘要：期設(shè)計(jì)模式如何理解觀察者發(fā)布訂閱模式定義觀察者模式又叫發(fā)布訂閱模式，它定義了一種一對(duì)多的關(guān)系，讓多個(gè)觀察者對(duì)象同時(shí)監(jiān)聽(tīng)某一個(gè)主題對(duì)象，這個(gè)主題對(duì)象的狀態(tài)發(fā)生變化時(shí)就會(huì)通知所有的觀察者對(duì)象，使得它們能夠自動(dòng)更新自己生活實(shí)例理解你今天去看一個(gè) 20190411期設(shè)計(jì)模式-如何理解觀察者(發(fā)布訂閱)模式? 定義: 觀察者模式又叫發(fā)布訂閱模式（Publish/Subscribe），它定義了一...

baishancloud 2019-08-23 16:53 評(píng)論0 收藏0
觀察者模式和發(fā)布訂閱模式（JS）

摘要：最近被人問(wèn)到設(shè)計(jì)模式，觀察者模式和發(fā)布訂閱模式二者有什么區(qū)別。觀察者模式觀察者模式，目標(biāo)和觀察者是基類，目標(biāo)提供維護(hù)觀察者的一系列方法，觀察者提供更新接口。最近被人問(wèn)到設(shè)計(jì)模式，觀察者（Observer）模式和發(fā)布（Publish）/訂閱（Subscribe）模式二者有什么區(qū)別。其實(shí)這兩種模式還是有些許差異的，本質(zhì)上的區(qū)別是調(diào)度的方式不同。觀察者模式觀察者模式，目標(biāo)和觀察者是基類...

Sanchi 2019-08-23 12:59 評(píng)論0 收藏0
js中的一對(duì)多 - 訂閱發(fā)布模式

摘要：解決命名空間問(wèn)題暫不管，刪除訂閱問(wèn)題這個(gè)用處不大目前我們先著手解決這個(gè)問(wèn)題對(duì)應(yīng)的消息么有被人訂閱沒(méi)有傳入具體的回調(diào)函數(shù)表示取消對(duì)應(yīng)的所有訂閱反向遍歷刪除訂閱回調(diào)函數(shù)這個(gè)對(duì)象，能夠解決大部分事件模擬的問(wèn)題。訂閱發(fā)布模式如果按數(shù)學(xué)翻譯其實(shí)就是.一對(duì)多的映射關(guān)系.怎么解釋呢？就是一個(gè)開(kāi)關(guān)，同時(shí)并聯(lián)幾個(gè)燈泡(在不同房間),觸發(fā)的時(shí)候，幾個(gè)燈泡都會(huì)得到指令，然后執(zhí)行發(fā)光的行為。訂閱發(fā)布模式...

Cobub 2019-08-22 11:00 評(píng)論0 收藏0
JS設(shè)計(jì)模式之Obeserver（觀察者）模式、Publish/Subscribe（發(fā)布/訂閱）模式

摘要：觀察者模式定義設(shè)計(jì)模式中對(duì)的定義一個(gè)對(duì)象稱為維持一系列依賴于它觀察者的對(duì)象，將有關(guān)狀態(tài)的任何變更自動(dòng)通知給它們。如圖模式比較觀察者模式則多了一個(gè)類似于話題調(diào)度中心的流程，發(fā)布者和訂閱者解耦。 Obeserver（觀察者）模式定義《js設(shè)計(jì)模式》中對(duì)Observer的定義：一個(gè)對(duì)象（稱為subject）維持一系列依賴于它（觀察者）的對(duì)象，將有關(guān)狀態(tài)的任何變更自動(dòng)通知給它們。《設(shè)計(jì)模...

荊兆峰 2019-08-26 13:37 評(píng)論0 收藏0
簡(jiǎn)單理解觀察者模式(pub/sub)在前端中的應(yīng)用

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

guyan0319 2019-08-23 12:10 評(píng)論0 收藏0