怎樣明白js的宣布-定閱形式

宣布-定閱形式/觀察者形式

宣布-定閱形式也叫觀察者形式,這是一個一對多的關聯,能夠多個定閱者定閱同一個事宜,當事宜觸發時就會關照定閱者去實行定閱時綁定的順序;

我舉個例子來解釋一下:

A同硯想在完婚的時刻約請摯友B、C、D、E、F、G…來喝喜酒,這個約請的名單實在就是定閱事宜

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

let A= new Person();

function drinkFn(){
    console.log( `xxxx年xx月xx日來xx大旅店和我的喜酒!`)
}
A.on("完婚",drinkFn);

比及A同硯要完婚的時刻,他就會去關照他的摯友XXX時候XX旅店過來飲酒,這個歷程就是宣布事宜

A.emit("完婚");

以下是我的完成歷程:

class EventEmitter {
    constructor(){
        this._count=null;
        
    }
    //定閱事宜
    on(type,callBack,flag){
        //建立_events對象
        if(!this._events){
            this._events=Object.create(null);
        }
        
        // 推斷_events對象是不是有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範例,則實行newListener對應的函數
        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);
        
    }

    //宣布事宜
    emit(type,...args){
        if(this._events[type]){
            this._events[type].forEach(fn => {
                fn.call(this,...args)
            });
        }
    }

    // 獵取當前type事宜的數組對象
    listeners(type){
        return this._events[type]||[];
    }

    // 定閱事宜並在第一時候觸發
    prependListener(type,callBack){
        this.on(type,callBack,true);
    }
    
    // 定閱一次性事宜並在第一時候觸發
    prependOnceListener(type,callBack){
        this.once(type,callBack,true);
    }
    
    // 獵取當前實例一切的事宜範例
    eventNames(){
        return Object.keys(this._events)
    }
    
    // 獵取當前type事宜範例的長度
    listenerCount(type){
        if(this._events[type]){
            return this._events[type].length
        }else{
            return 0
        }
        
    }
    
    // 移除type事宜一切的實行函數
    removeListener(type,callBack){
        if(this._events[type]){
            this._events[type]=this._events[type].filter(fn=>{
                return callBack!=fn&&fn.cb!=callBack
            })
        }
    }
    
    // 移除實例上一切的事宜
    removeAllListeners(){
        this._events=Object.create(null)
    }

    // 獵取當前實例的最大事宜綁定限定
    getMaxListeners(){
        return this._count ? this._count :EventEmitter.defaultMaxListeners;
    }
    
    // 設置當前實例的最大事宜綁定限定
    setMaxListeners(n){
        this._count=n;
    }
        
}
// 設置默許的最大事宜綁定限定
EventEmitter.defaultMaxListeners=10;

module.exports=EventEmitter;
    原文作者:Z不懂
    原文地址: https://segmentfault.com/a/1190000014462924
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞