成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

如何理解js的發(fā)布-訂閱模式

Amio / 2575人閱讀

摘要：發(fā)布訂閱模式觀察者模式發(fā)布訂閱模式也叫觀察者模式，這是一個(gè)一對(duì)多的關(guān)系，可以多個(gè)訂閱者訂閱同一個(gè)事件，當(dāng)事件觸發(fā)時(shí)就會(huì)通知訂閱者去執(zhí)行訂閱時(shí)綁定的程序我舉個(gè)例子來解釋一下同學(xué)想在結(jié)婚的時(shí)候邀請(qǐng)好友來喝喜酒，這個(gè)邀請(qǐng)的名單其實(shí)就是訂閱事件

發(fā)布-訂閱模式／觀察者模式

發(fā)布-訂閱模式也叫觀察者模式，這是一個(gè)一對(duì)多的關(guān)系，可以多個(gè)訂閱者訂閱同一個(gè)事件，當(dāng)事件觸發(fā)時(shí)就會(huì)通知訂閱者去執(zhí)行訂閱時(shí)綁定的程序；

我舉個(gè)例子來解釋一下：

A同學(xué)想在結(jié)婚的時(shí)候邀請(qǐng)好友B、C、D、E、F、G...來喝喜酒，這個(gè)邀請(qǐng)的名單其實(shí)就是訂閱事件

class Person extends EventEmitter{
    constructor(){
        super();
        
    }
}

let A= new Person();

function drinkFn(){
    console.log( `xxxx年xx月xx日來xx大酒店和我的喜酒！`)
}
A.on("結(jié)婚",drinkFn)；

等到A同學(xué)要結(jié)婚的時(shí)候，他就會(huì)去通知他的好友XXX時(shí)間XX酒店過來喝酒，這個(gè)過程就是發(fā)布事件

A.emit("結(jié)婚");

以下是我的實(shí)現(xiàn)過程：

class EventEmitter {
    constructor(){
        this._count=null;
        
    }
    //訂閱事件
    on(type,callBack,flag){
        //創(chuàng)建_events對(duì)象
        if(!this._events){
            this._events=Object.create(null);
        }
        
        // 判斷_events對(duì)象是否有type屬性
        if(this._events[type]){
            if(flag){
                this._events[type].unshift(callBack)
            }else{
                this._events[type].push(callBack)
            }
            
        }else{
            this._events[type]=[callBack]
        }
        
        //type如果不是newListener類型，則執(zhí)行newListener對(duì)應(yīng)的函數(shù)
        if(type!=="newListener"){
            this._events["newListener"]&&this._events["newListener"].forEach(fn=>{
                fn(type,callBack);
            })
        }
        // 超出最大綁定事件限制提示
        if(this._events[type].length>=this.getMaxListeners()){
            console.log("超出最大綁定事件限制")
        }
    }

    //訂閱一次性事件
    once(type,callBack,flag){
        function warp(...argments){
            callBack(...argments);
            this.removeListener(type,callBack)
        }
        warp.cb=callBack;
        this.on(type,warp,flag);
        
    }

    //發(fā)布事件
    emit(type,...args){
        if(this._events[type]){
            this._events[type].forEach(fn => {
                fn.call(this,...args)
            });
        }
    }

    // 獲取當(dāng)前type事件的數(shù)組對(duì)象
    listeners(type){
        return this._events[type]||[];
    }

    // 訂閱事件并在第一時(shí)間觸發(fā)
    prependListener(type,callBack){
        this.on(type,callBack,true);
    }
    
    // 訂閱一次性事件并在第一時(shí)間觸發(fā)
    prependOnceListener(type,callBack){
        this.once(type,callBack,true);
    }
    
    // 獲取當(dāng)前實(shí)例所有的事件類型
    eventNames(){
        return Object.keys(this._events)
    }
    
    // 獲取當(dāng)前type事件類型的長度
    listenerCount(type){
        if(this._events[type]){
            return this._events[type].length
        }else{
            return 0
        }
        
    }
    
    // 移除type事件所有的執(zhí)行函數(shù)
    removeListener(type,callBack){
        if(this._events[type]){
            this._events[type]=this._events[type].filter(fn=>{
                return callBack!=fn&&fn.cb!=callBack
            })
        }
    }
    
    // 移除實(shí)例上所有的事件
    removeAllListeners(){
        this._events=Object.create(null)
    }

    // 獲取當(dāng)前實(shí)例的最大事件綁定限制
    getMaxListeners(){
        return this._count ? this._count :EventEmitter.defaultMaxListeners;
    }
    
    // 設(shè)置當(dāng)前實(shí)例的最大事件綁定限制
    setMaxListeners(n){
        this._count=n;
    }
        
}
// 設(shè)置默認(rèn)的最大事件綁定限制
EventEmitter.defaultMaxListeners=10;

module.exports=EventEmitter;

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

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/94370.html

相關(guān)文章

  • JS每日一題:設(shè)計(jì)模式-如何理解觀察者(發(fā)布訂閱)模式?

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

    baishancloud 評(píng)論0 收藏0

  • 簡單理解觀察者模式(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 評(píng)論0 收藏0

  • JS中的觀察者模式(發(fā)布訂閱)

    摘要：觀察者模式簡介觀察者模式又稱發(fā)布訂閱模式，是一種最常用的設(shè)計(jì)模式之一了。其實(shí)瀏覽器的事件也是觀察者模式這里訂閱了的事件，當(dāng)我們的鼠標(biāo)點(diǎn)擊操作，事件發(fā)布，對(duì)應(yīng)的就會(huì)執(zhí)行。包括在內(nèi)的，只要是支持事件響應(yīng)的核心模塊都是的子類。 觀察者模式 簡介 觀察者模式又稱發(fā)布訂閱模式，是一種最常用的設(shè)計(jì)模式之一了。講道理，如果我們寫的不是稍微底層的代碼，可能不會(huì)用到它。 但是有了它會(huì)讓代碼更靈活，更加規(guī)...

    YacaToy 評(píng)論0 收藏0

  • 觀察者模式的使用介紹

    摘要：觀察者模式介紹觀察者模式又稱發(fā)布訂閱模式，它定義對(duì)象間的一種一對(duì)多的依賴關(guān)系，當(dāng)一個(gè)對(duì)象發(fā)生改變的時(shí)候，所依賴它的對(duì)象都能得到通知。關(guān)于內(nèi)部的觀察者模式可以參數(shù)這篇文檔?？偨Y(jié)總之，觀察者模式在中的使用是非常廣泛的。 javascript觀察者模式 介紹 觀察者模式又稱發(fā)布-訂閱模式，它定義對(duì)象間的一種一對(duì)多的依賴關(guān)系，當(dāng)一個(gè)對(duì)象發(fā)生改變的時(shí)候，所依賴它的對(duì)象都能得到通知。例如：我們訂閱...

    ityouknow 評(píng)論0 收藏0

  • 如何維護(hù)老舊代碼

    摘要：我們?cè)谄綍r(shí)的工作中，總是會(huì)遇到老舊的系統(tǒng)以及老舊陳的代碼。弊端就是需要維護(hù)兩套代碼，理解兩套技術(shù)選型。那么問題就來了新的代碼如何和舊的代碼解耦新代碼我們當(dāng)然是用新倉庫，新選擇，新打包工具。。。 我們?cè)谄綍r(shí)的工作中，總是會(huì)遇到老舊的系統(tǒng)以及老舊陳的代碼。他們是業(yè)務(wù)長年累月的積累,以及因?yàn)槭侨?、四年前的技術(shù)選型造成的系統(tǒng)架構(gòu)的不合理以及繁瑣的代碼。維護(hù)這些代碼總是很頭疼，程序員遇到這樣的代...

    lcodecorex 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

閱讀需要支付1元查看
<