Heim >Web-Frontend >js-Tutorial >Wie wirkt sich das Aufrufmuster auf das Schlüsselwort „this' in JavaScript aus?

Wie wirkt sich das Aufrufmuster auf das Schlüsselwort „this' in JavaScript aus?

Linda Hamilton
Linda HamiltonOriginal
2024-12-10 01:35:10720Durchsuche

How Does the Invocation Pattern Affect the `this` Keyword in JavaScript?

Wie sich Aufrufmuster auf das Schlüsselwort „this“ in JavaScript auswirken

Bei der Arbeit mit JavaScript kann es zu ungewöhnlichem Verhalten im Zusammenhang mit dem Schlüsselwort „this“ kommen " Schlüsselwort innerhalb von Funktionsdefinitionen. Dieser Artikel befasst sich mit den Feinheiten, wie das Aufrufmuster den Wert von „this“ beeinflusst, und bietet ein umfassendes Verständnis seines Verhaltens.

Bevor wir weiter darauf eingehen, ist es wichtig klarzustellen, dass JavaScript keine Klassen wie herkömmliche hat objektorientierte Sprachen. Stattdessen basiert es auf Objekten und Funktionen, wobei Klassen ein syntaktischer Zucker sind. Dieses Verständnis bildet die Grundlage für die Interpretation „dieses“ Verhaltens.

Aufrufmuster und „dies“

Der Wert von „dies“ hängt davon ab, wie eine Funktion aufgerufen wird. Dies wird als Aufrufmuster bezeichnet. Es gibt vier Hauptmuster:

1. Als Methode:

Wenn eine Funktion als Methode eines Objekts aufgerufen wird, ist „this“ an das Objekt selbst gebunden.

Beispiel:

// foo is the object
foo.bar = function() { alert(this); };
// "this" is bound to the foo object
foo.bar();

2. Als Funktion:

Beim Aufruf als eigenständige Funktion ist „this“ an das globale Objekt gebunden, normalerweise das „window“-Objekt in einem Browser.

Beispiel:

// Global function
var baz = function() { alert(this); };
// "this" is bound to the window object
baz();

3. Als Konstruktor:

Mit dem Schlüsselwort „new“ aufgerufen, wird „this“ an ein neu erstelltes Objekt gebunden. Dies imitiert klassenähnliches Verhalten.

Beispiel:

// Constructor function
function MyClass() { this.property = 'value'; }
// "this" is bound to the new instance
var instance = new MyClass();

4. Verwenden der Apply-Methode:

Mit der Funktion „Apply“ können Sie den Wert von „this“ zusammen mit Argumenten explizit definieren.

Beispiel:

var args = [1, 2];
var obj = { prop: 'value' };
// "this" is bound to the obj object, and args is passed as the arguments
fun.apply(obj, args);

Überlegung zu unerwartetem Verhalten:

Wenn Wenn als Callbacks verwendete innere Funktionen mit Mustern aufgerufen werden, die von ihrer Definition abweichen, kann es zu Inkonsistenzen in „diesem“ Verhalten kommen. Dies tritt häufig bei der Definition von Methoden mithilfe einer Objektliteral-Notation auf, bei der innere Funktionen Rückrufe als Funktionen aufrufen, was dazu führt, dass „dieses“ an das globale Objekt und nicht an das beabsichtigte Objekt gebunden wird.

Um dieses Problem zu beheben, muss die Das Muster „var that = this“ ist weit verbreitet. Durch das Speichern eines Verweises auf „this“ innerhalb eines Abschlusses können nachfolgende Aufrufe innerer Funktionen weiterhin auf den beabsichtigten Wert von „this“ zugreifen.

Das obige ist der detaillierte Inhalt vonWie wirkt sich das Aufrufmuster auf das Schlüsselwort „this' in JavaScript aus?. 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