Touch and take you to implement an EventEmitter

In the daily work of cross module development , A very common scene ： Event communication between different modules .

The following are given ES5、ES6 Two ways of implementation .

ES5 Realization

var events = {}
var Events = {
  on: function (key, fn) {
    if (typeof fn !== 'function') {
      return
    }
    events[key] = events[key] || []
    events[key].push(fn)
  },
  once: function (key, fn) {
    if (typeof fn !== 'function' || (fn.once && fn.hasExeced)) {
      return
    }
    fn.once = true
    fn.hasExeced = false
    events[key] = events[key] || []
    events[key].push(fn)
  },
  trigger: function (key) {
    var args = [].slice.call(arguments, 1)
    var fnList = events[key] || []
    fnList.forEach(function (item) {
      if (typeof item === 'function') {
        if (item.once && item.hasExeced) {
          return
        } else if (item.once && !item.hasExeced) {
          item.hasExeced = true
          item.apply(window, args)
        } else {
          item.apply(window, args)
        }
      }
    })
  }
}

Use

ES6 Realization

subscriber

The observer

application

ultimate

For the full code, see @careteen/event-emitter

summary