Understanding dojo hitch

Question

Ich kämpfe um zu verstehen, Anhängevorrichtung Funktion des Dojo Toolkit. Ich betrachte dieses Beispiel bei https://dojotoolkit.org/reference-guide/1.10/dojo/_base/lang.html, das ist die folgende:

require(["dojo/_base/lang"], function(lang){ 
var myObj = { 
    foo: "bar", 
    method: function(someArg){ 
     console.log(this.foo); 
    } 
    }; 

    var func = lang.hitch(myObj, "method"); 

    func(); 
}); 

Ist es nicht möglich, diese Funktion durch myObj.method (ARG) stattdessen zu verwenden? Danke

Answer 1

Ist es nicht möglich, diese Funktion von myObj.method(arg) stattdessen zu verwenden?

Ja, ist es in diesem speziellen Fall, aber es ist durchaus üblich, eine Funktion Verweis auf anderen Code muss passieren, und Funktionsreferenzen nicht (Standard) tragen eine besonderes this in sie gebacken; this wird eingestellt, indem Sie die Funktion aufrufen.

So zum Beispiel, wenn Sie myObj.method als Event-Handler verwenden, wenn es aufgerufen wird, this während des Anrufs beziehen sich nicht auf das Objekt myObj bezieht.

hitch behebt das durch Erstellen einer neuen Funktion, die, wenn sie aufgerufen wird, ruft Ihre Methode mit this richtig eingestellt.

Es ist seit einiger Zeit datiert, ES5 (im Jahr 2009) eingeführt Function#bind, die das gleiche tut. Aber das Dojo-Toolkit wurde ursprünglich im Jahr 2005 erstellt und enthielt daher solche Dienstprogramme. Hier ist das gleiche Code Function#bind statt:

require(["dojo/_base/lang"], function(lang){ 
    var myObj = { 
    foo: "bar", 
    method: function(someArg){ 
     console.log(this.foo); 
    } 
    }; 

    var func = myObj.method.bind(myObj); 

    func(); 
}); 

Hier ist ein anschauliches Beispiel demonstriert, wie es in einem Event-Handler Rolle kann:

var obj = { 
 
    foo: "bar", 
 
    method: function() { 
 
    console.log("this.foo = " + this.foo); 
 
    } 
 
}; 
 
document.getElementById("unbound").addEventListener("click", obj.method, false); 
 
document.getElementById("bound").addEventListener("click", obj.method.bind(obj), false);

<input type="button" id="unbound" value="Unbound"> 
 
<input type="button" id="bound" value="Bound">