javascript event handler

Question

javascript event handler

Navigation

#1 by (2 votes)
#2 by (1 votes)

0

I'm wanting to use custom events for Javascript , and the truth is that I try to find something but either I can not find the indicated information or I do not understand it, so it occurred to me to do my eventManager , quite truthful but it is what you can do at the moment to stop braking, the only problem I have is that I do not know how to execute my handler inside the object EventManager .

Here I leave the code to see if someone can help me.

My problem is in this line, it's clearly wrong but I do not know how to do it this._events[i].handler (this._events[i].args) .

var EventCustom=function() {
    this.eventName;
    this.handler;
    this.args;
};



var EventManager=function(siteController) {
    this.siteController=siteController;
    // es un array de objetos de tipo EventCustom
    this._events = [];
};

EventManager.EVENT_ON_USER_LOGIN = 'EVENT_ON_USER_LOGIN';


EventManager.prototype.addEventListener = function (evnt, handler,args)
{
    var tmpEvent = new EventCustom();
    tmpEvent.eventName = evnt;
    tmpEvent.handler = handler;
    tmpEvent.args = args;

    this._events.push(tmpEvent);

    //alert("addEventListener:"+this._events[0].eventName);
    //handler
} 

EventManager.prototype.dispatchEvent = function (evnt, args)
{


    for(var i=0; i< this._events.length; i++)
    {
        if(this._events[i].eventName == evnt)
        {
            **// aca deberia ejecutar el handler pero no me funciona
            //this._events[i].handler (this._events[i].args)//**
        }
    }

} 


var pruebaFn = function()
{
    alert("prueba");
}



var eventManager = new EventManager(this);
eventManager.addEventListener(EventManager.EVENT_ON_USER_LOGIN,pruebaFn);
eventManager.dispatchEvent(EventManager.EVENT_ON_USER_LOGIN);

If you also want to recommend a better way to do it, great. The truth is that I am setting up an entire system in Javascript and I want to pass certain calls to events since it is much more ordered.

javascript poo eventos

asked by Pablo 19.12.2016 в 15:31

source

2 answers

Problem with functions - Find item in a fix Why does 'jQuery' run twice?

score 2 · Answer 1

I suggest the use of the following API link

This api shows how you can implement events at the javascript level as it is managed in Node JS, it is as simple as:

//Generador de eventos
var event = new EventEmitter();
event.emit("nombreDeEvento", data);

//Cliente de eventos
event.on('nombreDeEvento', function(data){

});

score 1 · Answer 2

I think the problem is that you are not passing any arguments to him .. I've rewritten the code a bit and I think it's what you're looking for:

var EventCustom = function(evnt, handler, args) {
  this.eventName = evnt;
  this.handler = handler;
  this.args = args;
};

var EventManager = function(scope) {
  var that = scope;
  this._events = [];
};
EventManager.EVENT_ON_USER_LOGIN_1 = 'EVENT_ON_USER_LOGIN_1';
EventManager.EVENT_ON_USER_LOGIN_2 = 'EVENT_ON_USER_LOGIN_2';

EventManager.prototype.addEventListener = function(evnt, handler, args) {
  this._events.push(new EventCustom(evnt, handler, args));
}
EventManager.prototype.dispatchEvent = function(evnt, args) {
  for (event in this._events) {
    if (this._events[event].eventName === evnt) {
      this._events[event].handler(this._events[event].args);
    }
  }
}

var pruebaFn1 = function(args) {
  alert("pruebaFn " + args);
}
var pruebaFn2 = function(args) {
  alert("pruebaFn2 " + args);
}

var eventManager = new EventManager();
eventManager.addEventListener(EventManager.EVENT_ON_USER_LOGIN_1, pruebaFn1, "ok1");
eventManager.addEventListener(EventManager.EVENT_ON_USER_LOGIN_2, pruebaFn2, "ok2");
eventManager.dispatchEvent(EventManager.EVENT_ON_USER_LOGIN_1);

** I update the answer with a more optimal code;)

var EventManager = function() {
  this._events = {};
};
EventManager.EVENT_ON_USER_LOGIN_1 = 'EVENT_ON_USER_LOGIN_1';
EventManager.EVENT_ON_USER_LOGIN_2 = 'EVENT_ON_USER_LOGIN_2';

EventManager.prototype.addEventListener = function(id, h, a) {
  var e = {handler: h,args: a};
  this._events[id] = (!this._events[id]) ? [] : this._events[id];
  this._events[id].push(e);
}
EventManager.prototype.dispatchEvent = function(id) {
  for (e in this._events[id]) {
      this._events[id][e].handler(this._events[id][e].args);
  }
}

var pruebaFn1 = function(args) {
  alert("pruebaFn1 " + args);
}
var pruebaFn2 = function(args) {
  alert("pruebaFn2 " + args);
}

var eventManager = new EventManager();
eventManager.addEventListener(EventManager.EVENT_ON_USER_LOGIN_1, pruebaFn1, "ok1a");
eventManager.addEventListener(EventManager.EVENT_ON_USER_LOGIN_1, pruebaFn1, "ok1b");
eventManager.addEventListener(EventManager.EVENT_ON_USER_LOGIN_2, pruebaFn2, "ok2");
eventManager.dispatchEvent(EventManager.EVENT_ON_USER_LOGIN_1);