„bind()', „call()' und „apply()' von Javascript: Wann sollte ich sie verwenden?

Javascripts bind() vs. call() und apply(): Wann jeweils zu verwenden?

Während call() und apply() Werden beide zum Aufrufen von Funktionen in einem bestimmten Kontext verwendet (durch Festlegen des Schlüsselworts this innerhalb der Funktion). Ihr Hauptunterschied liegt in der Art und Weise, wie Argumente an die Funktion übergeben werden. call() erwartet, dass Argumente in einer durch Kommas getrennten Liste übergeben werden, während apply() ein Array von Argumenten erfordert.

Verwendung der bind()-Methode

Im Gegensatz dazu call() und apply(), bind() ruft die Funktion nicht sofort auf. Stattdessen wird eine neue gebundene Funktion zurückgegeben, die bei späterem Aufruf über den richtigen Kontext zum Aufrufen der ursprünglichen Funktion verfügt. Dies ist besonders nützlich in Situationen, in denen Sie den Kontext in asynchronen Rückrufen oder Ereignissen beibehalten möchten.

Betrachten Sie beispielsweise den folgenden Code:

function MyObject(element) {
    this.elm = element;

    element.addEventListener('click', this.onClick.bind(this), false);
};

MyObject.prototype.onClick = function(e) {
     var t=this;  //do something with [t]...
    //without bind the context of this function wouldn't be a MyObject
    //instance as you would normally expect.
};

Im onClick-Handler das Schlüsselwort this verweist auf die MyObject-Instanz, die den Ereignis-Listener erstellt hat, auch wenn das Ereignis asynchron ausgelöst wird.

Wann Call/Apply verwendet werden sollte vs. Bind

Verwenden Sie call() oder apply(), wenn Sie eine Funktion sofort aufrufen und ihren Kontext ändern müssen. Im Gegensatz dazu verwenden Sie bind(), wenn Sie möchten, dass die Funktion später in einem bestimmten Kontext aufgerufen werden kann, beispielsweise in Ereignissen.

Hier ist eine einfache Illustration:

var obj = {
  x: 81,
  getX: function() {
    return this.x;
  }
};

alert(obj.getX.bind(obj)()); // 81
alert(obj.getX.call(obj));   // 81
alert(obj.getX.apply(obj));  // 81

In allen drei Szenarien , ist die Ausgabe 81, da alle Funktionen die getX-Funktion im obj-Kontext aufrufen. Die bind()-Version gibt jedoch eine neue Funktion zurück, die bei Ausführung über den gewünschten Kontextsatz verfügt.

Das obige ist der detaillierte Inhalt von„bind()', „call()' und „apply()' von Javascript: Wann sollte ich sie verwenden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!