-1

I feel that this question will unfortunately be vague, and I will update as more information is provided, but I unfortunately don't know that to look up to begin studying what I'm seeing in this code snippet.

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

The snippet above is what I'm focused on, but below I will post more of the original script for context:

var events = new Events();
events.add = function(obj) {
  obj.events = { };
}
events.implement = function(fn) {
  fn.prototype = Object.create(Events.prototype);
}

function Events() {
  this.events = { };
}
Events.prototype.on = function(name, fn) {
  var events = this.events[name];
  if (events == undefined) {
    this.events[name] = [ fn ];
    this.emit('event:on', fn);
  } else {
    if (events.indexOf(fn) == -1) {
      events.push(fn);
      this.emit('event:on', fn);
    }
  }
  return this;
}
Events.prototype.once = function(name, fn) {
  var events = this.events[name];
  fn.once = true;
  if (!events) {
    this.events[name] = [ fn ];
    this.emit('event:once', fn);
  } else {
    if (events.indexOf(fn) == -1) {
      events.push(fn);
      this.emit('event:once', fn);
    }
  }
  return this;
}
Events.prototype.emit = function(name, args) {
  var events = this.events[name];
  if (events) {
    var i = events.length;
    while(i--) {
      if (events[i]) {
        events[i].call(this, args);
        if (events[i].once) {
          delete events[i];
        }
      }
    }
  }
  return this;
}
Events.prototype.unbind = function(name, fn) {
  if (name) {
    var events = this.events[name];
    if (events) {
      if (fn) {
        var i = events.indexOf(fn);
        if (i != -1) {
          delete events[i];
        }
      } else {
        delete this.events[name];
      }
    }
  } else {
    delete this.events;
    this.events = { };
  }
  return this;
}

If I had to guess, the way this looks is similar to how creating a class works, but I'm not following what use case doing this has or how to utilize it (in truth I don't understand it at all). I usually prefer to research these things on my own, but I'm not even sure where to start. Even a simple point in the right direction would be much appreciated.

Vidal Tan
  • 1
  • 1
  • You can also see https://css-tricks.com/understanding-event-emitters/#:~:text=An%20event%20emitter%20is%20a,referring%20to%20the%20same%20thing. https://nodejs.dev/learn/the-nodejs-event-emitter https://en.wikipedia.org/wiki/Publish%E2%80%93subscribe_pattern – CertainPerformance Jun 02 '22 at 04:20
  • 1
    This was the original way of how to create "classes" in javascript. Under the hood this is **still** the way of how objects work in javascript. Javascript didn't have "classes" instead it has **constructors**. Constructors are just like any other function but they are meant to be used with the `new` keyword. In version 6 of javascript (ES6) the `class` keyword still generates a function. If you define a class, the typeof of the class's name is `Function`.. – slebetman Jun 02 '22 at 06:03
  • Another difference between regular functions and constructors is that constructors are expected (by other humans) to have a prototype. The prototype is a property/attribute of the function and it is an object. The `prototype` is exactly the same as the class body/definition in other languages. Note that I say "by other humans" because javascript, proper, only has one type of `Function`. There is absolutely no difference between a regular function and a constructor and a class - the only difference is how a human programmer decide to use the function... – slebetman Jun 02 '22 at 06:07
  • Therefore the is a convention (human convention, the language does not care) to name all Constructors / Classes with an uppercase name to signal to other human programmers that this is a Constructor/Class and not a regular function... – slebetman Jun 02 '22 at 06:08
  • How objects work in javascript was (and still is) simple but a bit different from class based OO (which was not the first kind of OO programming paradigm invented). If a function (any function) is called with the `new` keyword the language will create an object instance by copying the function's `.prototype` property and creating a variable called `this` inside the function's scope that points to this newly created object. At the end of the function call the language will return this new object. So in javascript, all functions are potential classes/constructors – slebetman Jun 02 '22 at 06:13
  • ... and all classes are actually functions. It is like you take an OO language like C++ or Java and then expose all the internal mechanics of how classes are implemented and then remove classes from the language and tell programmers to use that thing instead. It looks weird but technically speaking is not really different from other OO paradigms. – slebetman Jun 02 '22 at 06:18
  • Wow this clears up so much. Thank you! @slebetman – Vidal Tan Jun 02 '22 at 15:04

0 Answers0