//Copyright (c) 2010 Nicholas C. Zakas. All rights reserved.
//MIT License
function EventTarget(){
this._listeners = {};
}
EventTarget.prototype = {
constructor: EventTarget,
addListener: function(type, listener){
if (typeof this._listeners[type] == "undefined"){
this._listeners[type] = [];
}
this._listeners[type].push(listener);
},
fire: function(event){
if (typeof event == "string"){
event = { type: event };
}
if (!event.target){
event.target = this;
}
if (!event.type){ //falsy
throw new Error("Event object missing 'type' property.");
}
if (this._listeners[event.type] instanceof Array){
var listeners = this._listeners[event.type];
for (var i=0, len=listeners.length; i < len; i++){
listeners[i].call(this, event);
}
}
},
removeListener: function(type, listener){
if (this._listeners[type] instanceof Array){
var listeners = this._listeners[type];
for (var i=0, len=listeners.length; i < len; i++){
if (listeners[i] === listener){
listeners.splice(i, 1);
break;
}
}
}
}
};
The EventTarget
type has three methods: addListener()
, fire()
, and removeListener
.
The addListener()
uses the private _listeners
object to store event handlers for various events. When an event handler is added, the method first checks to see if there’s a named property for that event type on the _listeners
object, and if not, creates one containing an array. The event handler function is then saved to the array for later.
The fire()
method fires an event with a given name. In effect, this method’s only job is to execute each event handler for the given event type. The method accepts either an object, in which case it’s expected to have a type
property, or a string, in which case a new object is created and the string is assigned as the value of type
. Next, if the event object doesn’t have atarget
property assigned, it is set to the current instance. This effectively creates an event object similar to the one most are familiar with via the BOM and DOM. Once the event object is created, the _listeners
object is checked for event handlers, and if found, they are executed. Note that in order to mimic the BOM/DOM approach, event handlers are executed in the scope of this
via the call()
method.
The last method, removeListener()
, simply reverses the process of addListener()
. It searches through the _listeners
property for the given event type to locate the specified event handler. If found, the event handler is removed by using the array’s splice()
method, and otherwise it exits without doing anything.
Basic usage:
var target = new EventTarget();
function handleEvent(event){
alert(event.type);
};
target.addListener("foo", handleEvent);
target.fire({ type: "foo" }); //can also do target.fire("foo")
target.removeListener("foo", handleEvent);
from :https://www.nczonline.net/blog/2010/03/09/custom-events-in-javascript/