观察者模式与发布订阅模式

观察者模式

• 观察者 在 被观察者 进行注册，将观察者加入观察者 队列
• 被观察者发起 事件 ，调用观察者提供的方法

class Subject{
    constructor() {
        this.subscriberList = []
    }

    addSubscriber(subscriber) {
        this.subscriberList.push(subscriber)
    }

    notifyAllSubscribers(data) {
        this.subscriberList.forEach(subscriber => {
            subscriber.update(data)
        })
    }
}

class Observer{
    constructor(name){
        this.name = name
    }

    update(data) {
        console.log(`${this.name} received data: ${data}`)
    }
}

const subject = new Subject()
const observer1 = new Observer('Observer 1')
const observer2 = new Observer('Observer 2')

subject.addSubscriber(observer1)
subject.addSubscriber(observer2)

subject.notifyAllSubscribers('hello')

发布订阅模式

• 订阅者 在 事件中心 订阅 事件
• 发布者 在 实践中心 发布（触发） 事件
• 事件中心 调用相对应的 事件

class EventEmitter {
    constructor() {
        this.events = {}
    }

    emit(event,data){
        this.events[event]?.forEach(callback => callback(data))
    }

    on(event,callback){
        this.events[event] = [...(this.events[event] || []),callback]
    }
}

const ee = new EventEmitter()

ee.on('event1',function(data){
    console.log(data,1);
})
ee.on('event1',function(data){
    console.log(data,2);
})

ee.emit('event1','hello')