¿Es posible enviar eventos en objetos normales (no DOM)?

Question

Acabo de descubrir que FileReader distribuye eventos como si fuera un elemento DOM. ¿Lo es? Me pregunto si es posible crear un objeto similar a FileReader, que no tiene una representación en la estructura HTML/XML, pero puede enviar eventos?

Answer 1

FileReader tiene métodos como addEventHandler porque es defined para implementar la interfaz EventTarget. EventTarget está definido por la especificación DOM Events, pero no necesita ser un objeto DOM para implementarlo. window, XMLHttpRequest y FileReader son otros objetos del Modelo de objetos del navegador que implementan EventTarget.

Lamentablemente, no hay una manera fácil de aprovechar la implementación nativa del navegador de objetivos de eventos ... podría intentar heredar de un objeto del navegador utilizando una propiedad como prototype, pero eso es muy poco fiable en general. Sin embargo, no es demasiado difícil de escribir código para implementar todos los métodos a sí mismo en la llanura de JavaScript:

function CustomEventTarget() { this._init(); } 

CustomEventTarget.prototype._init= function() { 
    this._registrations= {}; 
}; 
CustomEventTarget.prototype._getListeners= function(type, useCapture) { 
    var captype= (useCapture? '1' : '0')+type; 
    if (!(captype in this._registrations)) 
     this._registrations[captype]= []; 
    return this._registrations[captype]; 
}; 

CustomEventTarget.prototype.addEventListener= function(type, listener, useCapture) { 
    var listeners= this._getListeners(type, useCapture); 
    var ix= listeners.indexOf(listener); 
    if (ix===-1) 
     listeners.push(listener); 
}; 

CustomEventTarget.prototype.removeEventListener= function(type, listener, useCapture) { 
    var listeners= this._getListeners(type, useCapture); 
    var ix= listeners.indexOf(listener); 
    if (ix!==-1) 
     listeners.splice(ix, 1); 
}; 

CustomEventTarget.prototype.dispatchEvent= function(evt) { 
    var listeners= this._getListeners(evt.type, false).slice(); 
    for (var i= 0; i<listeners.length; i++) 
     listeners[i].call(this, evt); 
    return !evt.defaultPrevented; 
}; 

Precaución: el código anterior es la parte superior de la cabeza y no probado, pero puede funcionar. Sin embargo, tiene limitaciones como solo admitir el valor de retorno dispatchEvent si el objeto Event admite la propiedad DOM Level 3 defaultPrevented, y no admite DOM Level 3 stopImmediatePropagation() (que es imposible de implementar a menos que dependa de su propio objeto Event que expone una propiedad para eso). Además, no hay implementación de jerarquía o captura/burbujeo.

Por lo tanto, IMO: no gana mucho tratando de escribir el código que participa en el modelo de eventos DOM. Para el trabajo de devolución de llamada simple-JS, simplemente iría con su propia implementación ad hoc de listener-lists.

Answer 2

Supongo que es javascript; normalmente cualquier objeto que pueda obtener una referencia a un elemento DOM debería ser capaz de enviar un evento utilizando la función element.dispatchEvent; ver:

https://developer.mozilla.org/en/DOM/document.createEvent

https://developer.mozilla.org/en/DOM/element.dispatchEvent

Answer 3

bobince has the right idea, pero su código es solo un ejemplo. Para una implementación real probada en batalla, Mr. Doob has one that he uses in three.js.

Answer 4

jQuery puede enviar eventos desde objetos comunes. Here's a fiddle.

function MyClass() { 
    $(this).on("MyEvent", function(event) { 
     console.log(event); 
    }); 

    $(this).trigger("MyEvent"); 
} 

var instance = new MyClass();