Heim >Web-Frontend >js-Tutorial >Wie behalte ich die \'this\'-Referenz in JavaScript-Prototypfunktionen bei?

Wie behalte ich die \'this\'-Referenz in JavaScript-Prototypfunktionen bei?

Susan Sarandon
Susan SarandonOriginal
2024-11-04 03:33:02304Durchsuche

How to Preserve the 'this' Reference in JavaScript Prototype Functions?

So bewahren Sie die Referenz auf „this“ in JavaScript-Prototypfunktionen auf

In JavaScript kann die Beibehaltung der Referenz auf „this“ in Prototypfunktionen erfolgen eine Herausforderung, wenn sich der Umfang ändert. Um dieses Problem zu beheben, ziehen Sie die folgenden Lösungen in Betracht:

Verwenden der Bind-Methode

Mit der Bind-Methode können Sie eine neue Funktion erstellen, die den Verweis auf „this“ beibehält das Originalobjekt. Verwendung:

function.bind(object, argument1, argument2, ...);

Zum Beispiel:

MyClass.prototype.myfunc = function() {
  this.element.click(this.myfunc.bind(this));
};

Dadurch wird sichergestellt, dass sich „this“ auf die MyClass-Instanz bezieht, wenn das Klickereignis ausgelöst wird.

Erstellen einer Referenz auf „this“

Sie können auch eine Referenz auf „this“ innerhalb der Prototypfunktion erstellen:

MyClass.prototype.myfunc = function() {
  var myThis = this;
  ...
};

Dadurch können Sie auf „this.myValue“ zugreifen. innerhalb verschachtelter Funktionen. Möglicherweise müssen Sie diese Referenzen jedoch für jede Prototypfunktion erstellen, was umständlich sein kann.

Pfeilfunktionen verwenden

Pfeilfunktionen erben den „this“-Wert von umgebenden Kontext, der den Code vereinfachen kann:

MyClass.prototype.doSomething = () => {
  // operate on the element
};

Globale Variablen vermeiden

Vermeiden Sie die Verwendung globaler Variablen zum Halten der „this“-Referenz, da dies den globalen Namensraum verschmutzt und kann zu Konflikten führen, wenn mehrere MyClass-Objekte vorhanden sind.

Beispiel mit jQuery Each

Um mit der Each-Methode von jQuery zu arbeiten, können Sie die Bind-Methode verwenden, um die ' this'-Referenz:

MyClass.prototype.doSomething = function() {
  this.elements.each(this.doSomething.bind(this));
};

Fazit

Während die Verwendung von Prototypenmustern im Allgemeinen als gute Praxis angesehen wird, ist es für die Beibehaltung wichtig zu verstehen, wie die korrekte „This“-Referenz beibehalten wird Objektzustand und -verhalten. Die Bind-Methode und andere Techniken können effektive Lösungen für diese Herausforderung bieten.

Das obige ist der detaillierte Inhalt vonWie behalte ich die \'this\'-Referenz in JavaScript-Prototypfunktionen bei?. 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