Was sind die Unterschiede zwischen den JavaScript-Methoden „call()', „apply()' und „bind()'?

Verstehen der Unterschiede der Javascript-Methoden call(), apply() und bind()

In Javascript sind die Methoden call() und Mit den apply()-Methoden können Entwickler den Kontext (dies) einer Funktion angeben und Argumente übergeben. Obwohl beide Methoden ähnliche Zwecke erfüllen, unterscheiden sie sich darin, wie der Funktion Argumente bereitgestellt werden.

Wann sollte bind() verwendet werden?

Die bind()-Methode unterscheidet sich von call() und apply(), indem Sie eine neue Funktion erstellen können, die den Kontext der ursprünglichen Funktion beibehält. Dies erweist sich beim Umgang mit asynchronen Rückrufen oder Ereignissen als wertvoll.

Bedenken Sie den folgenden Codeausschnitt:

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

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

Wie das obige Beispiel zeigt, gibt bind() eine neue Funktion zurück, die bei späterer Ausführung zurückgibt , behält den Kontext (dies) der ursprünglichen Funktion bei. Dies erleichtert die Beibehaltung des Kontexts in asynchronen Rückrufen und Ereignissen.

Verwendung in Ereignissen und asynchronen Rückrufen

Ein häufiger Anwendungsfall für bind() umfasst, wie gezeigt, Ereignis-Listener im 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.
};

In diesem Beispiel stellt bind() sicher, dass die onClick()-Methode, wenn sie durch ein Ereignis ausgelöst wird, Behält den Kontext der MyObject-Instanz bei, die den Ereignis-Listener initiiert hat. Ohne bind() wäre der Kontext der onClick()-Methode nicht die erwartete Instanz.

Eine Implementierung von bind()

Eine vereinfachte Interpretation von bind( )-Methode kann wie folgt implementiert werden:

Function.prototype.bind = function(ctx) {
    var fn = this;
    return function() {
        fn.apply(ctx, arguments);
    };
};

Diese vereinfachte Implementierung erstellt eine neue Funktion, die die ursprüngliche Funktion mit dem bereitgestellten Kontext (ctx) und den Argumenten aufruft. Die ursprüngliche Function.prototype.bind()-Implementierung ist komplexer und behandelt zusätzliche Szenarios wie die Übergabe zusätzlicher Argumente.

Das obige ist der detaillierte Inhalt vonWas sind die Unterschiede zwischen den JavaScript-Methoden „call()', „apply()' und „bind()'?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!