Wie behalte ich den „this'-Kontext in „setInterval()' von JavaScript bei?

Beibehalten der „this“-Referenz im setInterval-Handler von JavaScript

Beim Arbeiten mit der setInterval()-Funktion von JavaScript kommt es häufig vor, dass „this“ auftritt. Problem. Dies tritt auf, wenn Sie innerhalb der Intervallhandlerfunktion auf die Eigenschaften oder Methoden eines Objekts zugreifen müssen.

Betrachten Sie den folgenden Code:

prefs: null,
startup: function() {
  // init prefs
  ...
  this.retrieve_rate();
  this.intervalID = setInterval(this.retrieve_rate, this.INTERVAL);
},

retrieve_rate: function() {
  var ajax = null;
  ajax = new XMLHttpRequest();
  ajax.open('GET', 'http://xyz.example', true);
  ajax.onload = function() {
    // access prefs here
  }
}

In diesem Beispiel möchten wir auf die Eigenschaft „prefs“ zugreifen innerhalb der ajax.onload-Handlerfunktion. Dies funktioniert jedoch nicht wie erwartet, da die Referenz „this“ im Intervallhandler verloren geht.

Um dieses Problem zu beheben, können Sie mit der Methode bind() eine neue Funktion erstellen, die die Referenz „this“ bindet. So geht's:

this.intervalID = setInterval(this.retrieve_rate.bind(this), this.INTERVAL);

Durch die Verwendung von bind() erstellen wir eine neue Funktion, deren this-Referenz an das ursprüngliche Objekt (this) gebunden ist. Dadurch wird sichergestellt, dass die Prefs-Eigenschaft im ajax.onload-Handler ordnungsgemäß referenziert wird.

Das obige ist der detaillierte Inhalt vonWie behalte ich den „this'-Kontext in „setInterval()' von JavaScript bei?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!