以下内容为个人见解:
1.发布-订阅模式我认为是解决通信问题很方便的一种模式。
2.我想以前用过addEventListener这个事件订阅方法的,这个是原生JS中发布-订阅模式的体现。
下面就讲一下这个发布-订阅模式的实现,请读者多多提意见。
发布-订阅模式,从这个名字可以看出应该会有两个动作,发布和订阅这两个动作:
on():用来订阅这个动作,订阅这个动作简单来说就是我订阅了一个东西,你什么时候送来我不知道,也不需要知道,你只要发布了我也就对应的收到了。
emit():发布这个动作,也就是调用on中注册的监听器的回调函数。
off():对于一些订阅动作的删除。
class eventEmiteer {
constructor () {
this.eventMap = {}; //存储订阅的信息
}
on = (type, handler) => {
// 判断回调函数的类型 如果不是一个函数就抛一个错误
if (!(handler instanceof Function)) {
throw new Error("handler is not a Function!");
}
// 判断事件在eventMap中有没有存在,没有要新建一个事件类型
if (!this.eventMap[type]) {
this.eventMap[type] = [];
}
// 直接往对应的事件类型中push回调函数
this.eventMap[type].push(handler);
}
emit = (type, params) => {
// 判断eventMap中有没有这个类型 有就进行遍历调用
if (this.eventMap[type]) {
this.eventMap[type].forEach((itemHandler) => {
itemHandler(params); // 传递对应的参数
});
}
}
// 移除对应类型的回调函数
off = (type, handler) => {
if (this.eventMap[type]) {
// 移除回调函数
this.eventMap[type].splice(this.eventMap[type].indexOf(handler) >>> 0, 1);
}
}
}