JS 发布-订阅模式

定义

发布-订阅模式其实是一种对象间一对多的依赖关系，当一个对象的状态发送改变时，所有依赖于它的对象都将得到状态改变的通知。
订阅者（Subscriber）把自己想订阅的事件注册（Subscribe）到调度中心（Event Channel），当发布者（Publisher）发布该事件（Publish Event）到调度中心，也就是该事件触发时，由调度中心统一调度（Fire Event）订阅者注册到调度中心的处理代码。

思路

*创建一个对象
*在该对象上创建一个缓存列表（调度中心）
on 方法用来把函数 fn 都加到缓存列表中（订阅者注册事件到调度中心）
*emit 方法取到 arguments 里第一个当做 event，根据 event 值去执行对应缓存列表中的函数（发布者发布事件到调度中心，调度中心处理代码）
*off 方法可以根据 event 值取消订阅（取消订阅）

代码实现

//创建公众号对象
const eventHub = {
    //创建缓存列表
    list: {
      
        // click:[f1,f2]
    },
//订阅
    on: (name, fn)=>{
    // 如果对象中没有对应的 event 值，也就是说明没有订阅过，就给 event 创建个缓存列表
    // 如有对象中有相应的 event 值，把 fn 添加到对应 event 的缓存列表里
        eventHub.list[name] = eventHub.list[name]||[];
        eventHub.list[name].push(fn)
    },
//发布
    emit: (name, data)=>{
        const q = eventHub.list[name];
        //如果缓存列表里面为空，就返回
        if(!q) return
        //遍历当前event里的缓存列表，并且依次执行
        q.map(f => f.call(null,data))
        return undefined;
    },
    off: (name, fn)=>{
        const q = eventHub.list[name];
        //如果缓存列表里面为空，就返回
        if(!q) return;
        //如果有，找到当前缓存列表里面对应的标号，并删除
        const index = q.indexOf(fn);
        if (index <0) return;
        q.splice(index,1)
    }
};

//这里模拟list里面要执行的函数
eventHub.on('click',console.log)
eventHub.on('click',console.error)

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