Wie kann „diese' Referenz in JavaScript-Prototypfunktionen beibehalten werden?

Beibehaltung „dieser“ Referenz in JavaScript-Prototypfunktionen

Eine häufige Herausforderung bei der Arbeit mit JavaScript-Prototypen besteht darin, die „diese“-Referenz innerhalb verschachtelter Elemente beizubehalten Funktionen. Dies ist besonders wichtig, wenn es um Ereignisse oder Rückrufe geht.

„This“ mit „bind()“ beibehalten:

Mit der JavaScript-Methode „bind()“ können wir erstellen eine neue Funktion, die die „this“-Referenz der ursprünglichen Funktion beibehält. Dies kann verwendet werden, um sicherzustellen, dass das Schlüsselwort „this“ in verschachtelten Funktionen immer auf das gewünschte Objekt verweist.

Im bereitgestellten Beispiel:

MyClass.prototype.myfunc = function() {
  this.element.click(function() {
    // Use bind() to preserve "this"
    // ...
  }.bind(this));
};

Hier verwenden wir bind() to Erstellen Sie einen neuen Click-Event-Handler, der die „this“-Referenz des MyClass-Objekts verwaltet. Dadurch können wir innerhalb des Event-Handlers auf die MyClass-Eigenschaften wie „this.myValue“ zugreifen.

„this“ mit Schließungen beibehalten:

Ein anderer Ansatz für Um „dies“ zu bewahren, müssen Verschlüsse verwendet werden. Abschlüsse sind Funktionen, die den Zugriff auf die Variablen ihres übergeordneten Bereichs behalten, auch nachdem die Ausführung des übergeordneten Bereichs abgeschlossen ist.

Im bereitgestellten Beispiel könnten wir einen Abschluss verwenden, um „dieses“ beizubehalten:

MyClass.prototype.doSomething = function() {
  var that = this; // Capture "this" in a closure

  this.elements.each(function() {
    // Use "that" to access the MyClass properties
    // ...
  });
};

Innerhalb der inneren Funktion können wir auf die MyClass-Eigenschaften zugreifen, indem wir auf „das“ verweisen.

Global vermeiden Variablen:

Es wird allgemein empfohlen, die Verwendung globaler Variablen zu vermeiden, um „dies“ beizubehalten, da dies zu Konflikten und Verschmutzung des globalen Namensraums führen kann.

Saubere und effiziente Lösung :

Die Verwendung von bind() oder Schließungen bietet saubere und effiziente Möglichkeiten, „dies“ in JavaScript-Prototypfunktionen beizubehalten, ohne Designprinzipien zu verletzen oder einzuführen unnötige Komplexität.

Das obige ist der detaillierte Inhalt vonWie kann „diese' Referenz in JavaScript-Prototypfunktionen beibehalten werden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!