一个生活中的例子关注公众号,作为用户去订阅公众号,当创作者发布新的内容时,会推送消息,用户可以接收消息这就是一个典型的发布与订阅模式
如何实现发布与订阅
1、创建对象
2、在对象上设置缓存列表(调度中心)
3、on方法里将函数fn添加到缓存列表(订阅者注册事件到调度中心)
4、emit 方法取到 arguments 里第一个当做 event,根据 event 值去执行对应缓存列表中的函数(发布者发布事件到调度中心,调度中心处理代码)
5、off 方法可以根据 event 值取消订阅(取消订阅)
代码实现
const eventHub = {
map: {
// click: [f1 , f2]
},
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(null, data))
return undefined
},
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.on('click', console.error)
setTimeout(()=>{
eventHub.emit('click', 'frank')
},3000)