手写事件总线 EventBus

发布订阅模式

发布订阅模式是一种广泛应用于异步编程的模式，是回调函数的事件化，常常用来解耦业务逻辑

作为一个事件总线，它应当具备一个任务队列，以及三个方法：订阅方法、发布方法、取消订阅

function EventBus () {
  
 let eventList = {} // 按事件名称创建任务队列
  
  // 注册事件（订阅）
  on() {}
  // 触发事件（发布）
  emit() {}
  // 移除指定回调（取消订阅）
  off() {}
}

首先来实现订阅方法 on()

它的作用是将事件的处理函数加入任务队列，所以需要接收两个参数：事件名称、事件的处理函数

  // 事件订阅
  EventBus.prototype.on = function (eventName, callback) {
    //拿到key的值
    let eventCallbacks = eventList[eventName]
    if (eventCallbacks) {
      // 判断是否有注册事件，如果条件成立，说明该事件已经注册过，所以我们可以把函数push进数组中
      eventCallbacks.push(callback)
    } else {
      // 如果没有注册事件以数组的形式存储一份  因为一个事件下面可以注册多个函数
      eventList[eventName] = [callback]
    }
  }

然后是触发事件的方法 emit()

其功能是每触发一次事件，会执行对应事件的所有回调函数。所以它的参数必须有一个是事件名称，另外还可以传入一个参数作为回调函数的参数

  //事件触发
  EventBus.prototype.emit = function (eventName, data) {
    // 还是拿到key 的值
    let callbacks = eventList[eventName]
    if (callbacks && callbacks.length > 0) {
      // 条件成立之后 通过遍历拿到每个存储的函数
      callbacks.forEach(callback => callback(data))

    }
  }

最后是注销方法 off()，它将需要注销的事件处理函数从对应事件的任务队列中清除

  // 事件移除 
 EventBus.prototype.off = function (eventName) {
    // 如果传入值为空 移除所有监听事件
    if (typeof eventName === 'undefined') {
      eventList = {}
    } else {
      // 移除指定的监听事件
      delete eventList[eventName]
    }
  }