(extrahiert eine Erklärung, die in den Kommentaren in anderen Antwort versteckt war)
Das Problem in der folgenden Zeile liegt:
this.dom.addEventListener("click", self.onclick, false);
Hier passieren Sie ein Funktionsobjekt als Rückruf verwendet werden soll . Wenn das Ereignis ausgelöst wird, wird die Funktion aufgerufen, aber jetzt hat sie keine Verknüpfung mit einem Objekt (this).
Das Problem kann wie folgt durch Umwickeln die Funktion (mit seiner Objektreferenz) in einem Verschluss gelöst werden:
this.dom.addEventListener(
"click",
function(event) {self.onclick(event)},
false);
Da die Variable selbst diese, wenn der Verschluß angelegt wurde, wobei die Verschluss-Funktion zugewiesen wurde wird sich den Wert der Eigenvariablen merken, wenn sie zu einem späteren Zeitpunkt aufgerufen wird.
Eine alternative Möglichkeit, dies zu lösen, ist eine Nutzenfunktion zu machen (und vermeiden Variablen diese zur Bindung):
function bind(scope, fn) {
return function() {
fn.apply(scope, arguments);
};
}
Der aktualisierte Code würde wie dann aussehen:
this.dom.addEventListener("click", bind(this, this.onclick), false);
Function.prototype.bind
ist Teil von ECMAScript 5 und bietet die gleiche Funktionalität. So können Sie tun:
this.dom.addEventListener("click", this.onclick.bind(this), false);
Für Browser, die ES5 noch nicht unterstützen, MDN provides the following shim:
if (!Function.prototype.bind) {
Function.prototype.bind = function (oThis) {
if (typeof this !== "function") {
// closest thing possible to the ECMAScript 5 internal IsCallable function
throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable");
}
var aArgs = Array.prototype.slice.call(arguments, 1),
fToBind = this,
fNOP = function() {},
fBound = function() {
return fToBind.apply(this instanceof fNOP
? this
: oThis || window,
aArgs.concat(Array.prototype.slice.call(arguments)));
};
fNOP.prototype = this.prototype;
fBound.prototype = new fNOP();
return fBound;
};
}
Die Dienstprogrammfunktion createCallback ist praktisch! Vielen Dank. –
closure() ist wahrscheinlich ein besserer Name. – hishadow
Oder bind() oder bindMethod(). – outis