什么是订阅发布者模式?
定义
发布-订阅模式其实是一种对象间一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到状态改变的通知
订阅者(Subscriber)把自己想订阅的事件注册(Subscribe)到调度中心(Event Channel),当发布者(Publisher)发布该事件(Publish Event)到调度中心,也就是该事件触发时,由调度中心统一调度(Fire Event)订阅者注册到调度中心的处理代码
图解
图解如下
Demo
实现代码如下
//发布订阅模式
const EventManager=(function(){
//事件存储对象
let eventList={};
//事件注册与绑定(形参event指代事件名,形参handler指代事件欲绑定的函数)
function on(event,handler){
//判断事件是否存在
if(!eventList[event]){
//如果没有则注册事件,并给事件绑定handler函数
eventList[event]=[handler]
}else{
//如果有则给事件绑定handler函数(一个事件绑定多个函数)
eventList[event].push(handler);
}
}
//事件触发(形参event指代事件名,形参data事件绑定函数的传入参数)
function fire(event,data)
{
//判断事件存储对象是否包含该事件
if(eventList[event]){
//如果有则调用事件绑定的所有函数
eventList[event].forEach(handler=>handler(data))
}
}
//事件解绑
function off(event,handler)
{
//如果事件存在
if(eventList[event])
{
//且传入的形参handler为空
if(!handler){
//删除事件存储对象中的事件
delete eventList[event];
}
}
//如果事件不存在
else
{
//使用indexOf获取事件绑定的指定函数下标
let index=eventList[event].indexOf(handler);
//使用splice删除事件指定绑定函数
eventList[event].splice(index,1);
}
}
return {
on:on,//on事件注册与绑定
fire:fire,//fire触发事件
off:off//off事件解绑
}
})();
EventManager.on('sayHello',function(data){
console.log('hello'+data);
})
EventManager.fire('sayHello','HelloWorld');
精彩内容
大家都在找:
javascript:javascript错误怎么解决
开发语言:开发语言排行榜
ecmascript:ecmascript6
发表评论