發佈訂閱模式

發佈訂閱模式-1

//jQuery callbacks原理
window.jQuery= {
    callbacks(){
        let callbacks = [];
        function add(callback){
            callbacks.push(callback)
        }
        function remove(callback){
            callbacks = callbacks.filter(item=>item!==callback);
        }
        function fire(){
            callbacks.forEach(item=>item())
        }
        return {
            add,
            remove,
            fire
        }
    }
}
let a = jQuery.callbacks();
let a1 = ()=>{console.log('add a1')}
let a2 = ()=>{console.log('add a2')}
a.add(a1);
a.add(a2);
a.remove(a1);
a.fire();

發佈訂閱模式-2

class EventEmitter{
    constructor(){
        this._events = {}
    }
    on(type,listener){
        let listeners = this._events[type];
        if(listeners){
            listeners.push(listener)
        }else{
            this._events[type] = [listener]
        }
    }
    emit(type){
        let listeners = this._events[type];
        let args = Array.prototype.slice.call(arguments);
        if(listeners){
            listeners.forEach(item => item(...args));
        }
    }
}
let eve = new EventEmitter();
eve.on('click',function(name,age){
    console.log('click',name,age)
})
eve.emit('click','test',9)

發佈訂閱-3

class Agent{
    constructor(){
        this._events = {};
    }
    subscribe(type,listener){
        let listeners = this._events[type];
        if(listeners){
            listeners.push(listener);
        }else{
            this._events[type] = [listener]
        }
    }
    publish(type){
        let listeners = this._events[type];
        let args = Array.prototype.slice.call(arguments,1);
        if(listeners){
         listeners.forEach(listener=>listener(...args));   
        }
    }
}

class LandLord{
    constructor(name){this.name = name;}
    lend(agent,area,money){
        agent.publish('house',area,money)
    }
}
class Tenant{
    constructor(name){this.name = name;}
    rent(agent){
        agent.subscribe('house',(area,money)=>{
            console.log(`${this.name}看到中介的新房源了,${area}平方,房租${money}`)
        })
    }
}
let agent = new Agent();
let t1 = new Tenant('張三');
let t2 = new Tenant('李四');
t1.rent(agent);
t2.rent(agent);
let landLord = new LandLord();
landLord.lend(agent,60,4000)

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章