解读发布订阅模式，手写代码

什么是发布订阅模式

发布订阅模式是一种常见的设计模式，由三部分组成：发布者(Publisher)、调度中心（Event Channel）、订阅者（Subscriber）。

订阅者将想要订阅的事件注册到调度中心，当发布者发布该事件到调度中心，也就是该事件触发时，由调度中心统一调度订阅者注册到调度中心的处理代码。

手写发布订阅

const eventHub = {
    map: {},
    on: (name, fn) => {
        eventHub.map[name] = eventHub.map[name] || []
        eventHub.map[name].push(fn)
    },
    emit: (name, data) => {
        const q = eventHub.map[name]
        if(!q) return
        q.map(f => f.call(undefined, data))
    },
    off: (name, fn) => {
        const q = eventHub.map[name]
        if(!q) return
        const index = q.indexOf(fn)
        if(index < 0) return
        q.splice(index, 1)
    }
}

测试一下，功能是否正常

eventHub.on('click', console.log)
eventHub.off('click', console.log)
eventHub.on('click', console.error)

setTimeout(() => {
    eventHub.emit('click', 'River')
},3000)

优点

1. 广泛应用于异步编程
2. 发布者与订阅者之间解耦

缺点

1. 创建订阅本身要消耗一定的时间和内存
2. 虽然可以弱化对象之间的联系，但是多个订阅者和发布者嵌套一起的时候，程序难以跟踪维护

参考文章

1. # JavaScript 发布-订阅模式
2. # 观察者模式 vs 发布订阅模式