¿Cómo puedo agregar una función prototipo a un detector de eventos en la función de inicialización?

Question

No estoy seguro exactamente cómo formular mi pregunta, así que me presento un ejemplo:

function foo() { 
    window.addEventListener("keydown", function(event) { 
     bar(event.keycode); 
} 

foo.prototype.bar = function (keycode) { 
//code 
} 

He intentado usar this.bar(), pero que se traduce en el uso de la window como this. ¿Hay alguna manera de hacerlo, o tendré que llamar a otro método de inicialización manualmente?

Answer 1

Enlaza this.bar a antes de aprobarlo.

function foo() { 
    window.addEventListener("keydown", this.bar.bind(this), false); 
} 


foo.prototype.bar = function (event) { 
    console.log(event.keyCode); 
} 

demostración http://jsfiddle.net/2tee4/

Answer 2

Una solución alternativa si no tiene Function.prototype.bind * disponible, y que está dispuesto a añadir funciones adicionales a Function.prototype sería para cerrar sobre la llamada a this.bar:

function foo() { 
    var self; 
    self = this; 
    window.addEventListener('keydown', function (e) { 
     self.bar(e); 
    }, false); 
} 
foo.prototype.bar = function (e) { 
    console.log(e.keyCode); 
} 

_{* aunque su uso de addEventListener sin me lleva a creer que Function.prototype.bind sería un acce elección ptable}

---

Además, las bibliotecas, tales como jQuery puede incluir su propia forma de bind, jQuery es de jQuery.proxy.

Answer 3

Si su intención es agregar un nuevo oyente para cada foo creado, otra opción es hacer foo implementar la interfaz EventListener, y simplemente pasar this en lugar del controlador.

function Foo() { 
    window.addEventListener("keydown", this, false); 
} 

Foo.prototype.bar = "foobar"; 

Foo.prototype.handleEvent = function(e) { 
    console.log(e.type); // "mousedown" (for example) 
    console.log(this.bar); // "foobar" 
}; 

new Foo(); 

Tenga en cuenta que esto solo funciona con addEventListener().

DEMO:http://jsfiddle.net/k93Pr/