Heim >Web-Frontend >js-Tutorial >Wie kann ich den richtigen „diesen' Kontext in setTimeout-Rückrufen beibehalten?

Wie kann ich den richtigen „diesen' Kontext in setTimeout-Rückrufen beibehalten?

Mary-Kate Olsen
Mary-Kate OlsenOriginal
2024-12-23 15:27:11286Durchsuche

How Can I Preserve the Correct

Beibehalten des Kontexts in setTimeout-Rückrufen mit „this“

Wenn setTimeout verwendet wird, um einen Rückruf nach einer Verzögerung zu planen, möchte man häufig darauf zugreifen Kontext aus der Funktion, in der der setTimeout-Aufruf durchgeführt wurde. Es ist jedoch wichtig zu wissen, dass setTimeout den Rückruf so ausführt, dass „this“ auf das globale Objekt verweist, was zu unerwartetem Verhalten führen kann, wenn sich Ihr Rückruf auf Instanzmitglieder bezieht.

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

1. Speichern Sie einen Verweis auf den Kontext:

Die einfachste Lösung besteht darin, vor dem Aufruf von setTimeout einen Verweis auf den richtigen Kontext zu speichern. Diese Referenz kann dann als Parameter an die Callback-Funktion übergeben werden.

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

2. Bind-Methode verwenden (ES5):

Die Bind-Methode kann verwendet werden, um eine neue Funktion zu erstellen, die einen vordefinierten „diesen“ Wert hat. Dadurch entfällt die Notwendigkeit, manuell einen Verweis auf den Kontext zu speichern.

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

3. Pfeilfunktionen verwenden (ES6):

Pfeilfunktionen haben keinen eigenen „this“-Wert. Stattdessen erben sie den Wert „this“ vom umschließenden lexikalischen Bereich. Dies macht sie ideal für die Beibehaltung des Kontexts in Rückrufen.

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

4. Kontext als Argument übergeben (ES5):

In HTML5 können Sie Argumente an die Rückruffunktion von setTimeout übergeben. Dadurch können Sie den zu verwendenden Kontext explizit angeben.

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

Durch das Verständnis dieser Ansätze können Sie den richtigen Kontext in Ihren setTimeout-Rückrufen effektiv beibehalten und unerwartetes Verhalten vermeiden.

Das obige ist der detaillierte Inhalt vonWie kann ich den richtigen „diesen' Kontext in setTimeout-Rückrufen beibehalten?. 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