手撕js:发布订阅模式
概念
布-订阅模式又叫观察者模式,它定义对象间的一种一对多的依赖关系 当一个对象的状态发生改变时,所有依赖它的订阅者都会接收到通知
代码模块:
class EventCenter{
//1.定义事件容器,用来装事件数组
handlsers={};
//事件名,事件参数,事件方法
addEventListener(type ,handlser)
{
//创建新的数组
if(!this.handlsers[type])
{
this.handlsers[type]=[]
}
this.handlsers[type].push(handlser)
}
//2.触发事件
dispatchEvent(type)
{
//没有注册抛出错误
if(!this.handlsers[type])
{
return new Error("该事件未注册")
}
//触发事件
this.handlsers[type].forEach(handlser=>{
handlser(...params)
})
}
//3.事件移除
removeEventListener(type,handlser)
{
//不存在该事件
if(!this.handlsers[type])
{
return new Error("该事件无效")
}
//无事件方法,删除该事件的订阅和发布
if(!handlser)
{
delete this.handlsers[type]
}else{
//找出对应事件方法的发布订阅数组的下标
const index=this.handlsers[type].findIndex(el=>el===handlser)
//未找到
if(index===-1)
return new Error("无绑定该事件")
//找到下标,删除该事件的订阅和发布事件
this.handlsers[type].splice(index,1)
if(this.handlsers[type].length===0)
{
delete this.handlsers[type]
}
}
}
}