03事件模型-发布订阅模式

vue加入发布订阅模型：就是解耦

 

发布订阅模式：（形式不限于函数，可以是函数或者对象等）

中间的全局容器，用来存储可以被触发的东西（函数、对象）

需要有一个方法，可以往容器里面传入东西（函数，对象等）

需要有一个方法，可以将容器里面的东西取出来使用（函数调用，对象方法的调用）

class Event {
  constructor() {
    this.list = {} //{key1:[f1,f2],key2:[]}
  }
  on(type, handler) {
    this.list[type] = (this.list[type] || []).concat(handler)
  }
  emit(type, ...data) {
    const fns = this.list[type]
    if (!fns || (!fns.length)) return false
    fns.forEach(fn => fn.apply(this, data))
  }
  off(type, handler) {
    const fns = this.list[type]
    if (!type && !handler) this.list = {}  // 移除所有事件 event.off() 删除所有事件 
    else if (!fns || !fns.length) return false //event.off('乱传的type')
    else if (type && !handler) {
      delete this.list[type] //event.off('click') //删除所有的click事件
    } else { //传入两个参数 event.off("click",handler)
      this.list[type] = fns.filter(fn => fn !== handler)
    }

  }
}