js事件派发(事件中心)

// 事件中心 事件派发 闭包
const EventBus =  () => {
  let all = {} // 利用闭包的特性,实现all的状态管理
  return {
    all, // 事件BUS
    /*
    * description 监听事件
    * params type 事件名
    * params handler 回调函数
    * */
    on: (type, handler) => {
      all[type] = handler
    },
    /*
    * description 取消监听某事件
    * params type 事件名
    * */
    off: (type) => {
      delete all[type]
    },
    /*
    * description 事件派发
    * params type 事件名
    * params event 派发的参数
    * */
    emit: (type, event) => {
      let handlers = all[type]
      if (handlers) {
        handlers(event)
      }
    }
  }
}
// use
let eventCenter = EventBus()
eventCenter.on('getName', (e) => {
  console.log('e', e)
})
eventCenter.on('getSex', (e) => {
  console.log('e', e)
})
eventCenter.emit('getName', {detail: '哈哈哈哈哈'})
eventCenter.off('getName')
eventCenter.emit('getName', {detail: '哈哈哈哈哈灌灌灌灌灌'})
eventCenter.emit('getSex', {detail: 'male'})
eventCenter.emit('getSex', {detail: 'female'})
eventCenter.off('getSex')
eventCenter.emit('getSex', {detail: 'unknow'})
eventCenter = null
eventCenter = EventBus()
eventCenter.on('getAge', (e) => {
  console.log('e', e)
})
eventCenter.emit('getAge', {detail: '12'})
eventCenter = null

你可能感兴趣的:(javascript前端闭包)