Search code examples
javascriptnode.jsecmascript-6eventemitter

How to use this function based Event Emitter?


In this old answer is there the below function based event emitter.

Maybe it is super obvious how to use it, but not for me, so I would really appreciate if someone could make a hello world example with it.

Can anyone figure out how to use it?

function EventBase() {
  this.events = {};
};

EventBase.prototype = {
  on: function (event, listener) {
    if (typeof event !== 'string') throw new TypeError("Event must be a string");
    if (typeof event !== 'string') throw new TypeError("Listener must be a function");
    this.events[event] || (this.events[event] = []);
    this.events[event].push(listener);
  },

  off: function (event, listener) {
    if (arguments.length === 0) {
      // remove all listeners
      this.events = {};
      return;
    }

    if (!this.events[event]) {
      // return if there's no event by the given name
      return;
    }

    if (arguments.length === 1) {
      // remove all listeners for the given event
      delete this.events[event];
      return;
    }

    // remove specific listener
    this.events[event] = this.events[event].filter(function (func) {
      return func !== listener;
    });
  },

  emit: function (event) {
    if (!this.events[event]) {
      // return if there's no event by the given name
      return;
    }

    // get args
    var args = [].slice.call(arguments, 1);

    // invoke listeners
    this.events[event].forEach(listener => listener.apply(this, args));
  },

  getListenerCount: function (event) {
    // get total number of listeners
    if (arguments.length === 0) {
      return Object.keys(this.events).reduce((count, key) => count + this.getListenerCount(key), 0);
    }

    // return zero for non-existing events
    if (!this.events[event]) {
      return 0;
    }

    // return count for specific event
    return this.events[event].length;
  }
};

Solution

  • EventBase is a constructor function. After we instantiate it, we can call the methods defined in the prototype. on method allows you to add a listener callback to a certain event name. emit allows to emit an event name, which will then trigger the listener listening for that event

    const event = new EventBase()
    
    event.on("connect", () => {
      console.log("connected")
    })
    
    event.emit("connect")