Heim >Web-Frontend >js-Tutorial >Wie kann ich den Kontext korrekt an einen „setTimeout'-Rückruf übergeben?

Wie kann ich den Kontext korrekt an einen „setTimeout'-Rückruf übergeben?

Patricia Arquette
Patricia ArquetteOriginal
2024-12-25 22:25:23287Durchsuche

How Can I Correctly Pass Context to a `setTimeout` Callback?

Kontext an setTimeout-Rückruf übergeben

Die Übergabe des richtigen Kontexts an den setTimeout-Rückruf kann eine Herausforderung sein, insbesondere bei der Arbeit mit Objektmethoden. Wenn im Callback darauf verwiesen wird, führt dies zunächst häufig dazu, dass das globale Objekt verwendet wird.

Um dieses Problem zu beheben, gibt es mehrere Ansätze:

1. Speichern Sie die Referenz (ES5 und früher):

var that = this;
if (this.options.destroyOnHide) {
     setTimeout(function() { that.tip.destroy() }, 1000);
}

Diese Technik verwendet eine temporäre Variable, um den Kontext zu speichern, aus dem setTimeout aufgerufen wird.

2 . bind-Methode (ES5 und höher):

if (this.options.destroyOnHide) {
     setTimeout(function() { this.tip.destroy() }.bind(this), 1000);
}

Die bind-Methode erstellt eine neue Funktion mit einem vordefinierten this-Wert. In diesem Fall wird dies auf das Objekt gesetzt, bevor setTimeout aufgerufen wird.

3. Pfeilfunktionen (ES6 und höher):

if (this.options.destroyOnHide) {
     setTimeout(() => { this.tip.destroy() }, 1000);
}

Pfeilfunktionen erben ihren lexikalischen Kontext, der mit dem Objekt identisch ist, das setTimeout aufruft. Dadurch entfällt die Notwendigkeit, diese zu binden oder aufzubewahren.

4. Übergabe von Argumenten an setTimeout (HTML5):

if (this.options.destroyOnHide) {
     setTimeout(function(that) { that.tip.destroy() }, 1000, this);
}

HTML5 hat in setTimeout eine Funktion eingeführt, die die Übergabe zusätzlicher Argumente an den Rückruf ermöglicht. Hier wird dies als Argument übergeben und innerhalb der Callback-Funktion abgerufen.

Das obige ist der detaillierte Inhalt vonWie kann ich den Kontext korrekt an einen „setTimeout'-Rückruf übergeben?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn