dieses Schlüsselwort in Javascript

Eines der verwirrendsten Schlüsselwörter in JavaScript ist das Schlüsselwort this. Es handelt sich um ein spezielles Bezeichner-Schlüsselwort, das automatisch im Umfang jeder Funktion definiert wird, aber worauf es sich genau bezieht, verwirrt selbst erfahrene JavaScript-Entwickler.

Das Schlüsselwort this bezieht sich auf den Kontext, in dem ein Codeteil, beispielsweise der Hauptteil einer Funktion, ausgeführt werden soll. Am häufigsten wird es in Objektmethoden verwendet, wobei es sich auf das Objekt bezieht, an das die Methode angehängt ist, sodass dieselbe Methode für verschiedene Objekte wiederverwendet werden kann.

Der Wert hierfür kann dort identifiziert werden, wo die Funktion ausgeführt wird, und nicht dort, wo die Funktion deklariert wird

Wir werden verschiedene Regeln untersuchen, um dies in Javascript zu identifizieren

Standardbindung

Die Standardregel, die wir am häufigsten bei Funktionsaufrufen anwenden: eigenständige Funktionsausführung. Betrachten Sie diese Regel als die standardmäßige Sammelregel, wenn keine der anderen Regeln zutrifft.

In eigenständigen Funktionsaufrufen ist dieser Wert globalObject (in der Browserumgebung ist es ein Fensterobjekt, in der Knotenumgebung ist er global)

function bar() {
    console.log(this) // this will be global object (window)
}
bar()

Aber......

Der Wert kann unterschiedlich sein, je nachdem, wie der Code im strikten Modus oder im nicht strikten Modus ausgeführt wird

Wenn die Funktion als eigenständige Funktion aufgerufen wird, bezieht sich dies normalerweise auf ein globales Objekt im nicht strikten Modus und auf ein undefiniertes Objekt im strikten Modus

"use strict"
function bar() {
    console.log(this) // undefined
}
bar()

Subtil, aber wichtig: Das globale Objekt ist nur für die Standardbindung geeignet, wenn der Inhalt von bar() nicht im strikten Modus ausgeführt wird;

function bar() {
    console.log(this) // global object (window)
}
(function() {
    "use strict"
    bar()
})()

Implizite Bindung

Wenn eine reguläre Funktion als Methode eines Objekts aufgerufen wird (obj.method()), zeigt dies auf dieses Objekt.

function bar() {
    console.log(this)
}
const obj = {
    name: "javascript",
    foo
}
obj.foo() // this here is object owing the function

Beachten Sie zunächst die Art und Weise, wie bar() deklariert und später als Referenzeigenschaft zu obj hinzugefügt wird. Unabhängig davon, ob foo() zunächst auf obj deklariert wird oder später als Referenz hinzugefügt wird (wie dieses Snippet zeigt), ist die Funktion in keinem Fall wirklich „im Besitz“ oder „enthalten“ des obj-Objekts.

Implizit verloren:
Bei der Verwendung von Rückrufen verliert die implizit gebundene Funktion diese Bindung, was normalerweise bedeutet, dass sie auf die Standardbindung zurückgreift, entweder des globalen Objekts oder undefiniert, je nach striktem Modus.

function bar() {
    setTimeout(function() {
        console.log(this) // this will be global object
    }, 1000);
}
const obj = {
    name: "javascript",
    bar
}
obj.bar() // this will be global object

function bar() {
    console.log(this)
}
const obj = {
    name: "javascript",
    bar
}
const a = obj.bar
a() // this will be global object

Explizite Bindung

Bei der impliziten Bindung, wie wir gerade gesehen haben, mussten wir das betreffende Objekt so verändern, dass es einen Verweis auf sich selbst auf die Funktion enthält, und diese Eigenschaftsfunktionsreferenz verwenden, um dies indirekt (implizit) an das Objekt zu binden.

Was aber, wenn Sie einen Funktionsaufruf erzwingen möchten, ein bestimmtes Objekt für diese Bindung zu verwenden, ohne eine Eigenschaftsfunktionsreferenz auf das Objekt zu setzen?

Ja, das ist möglich. Javascript bietet viele Methoden wie .map, .filter für Arrays. Wir haben nur wenige Methoden in Funktion. Diese sind „Apply“, „Call“ und „Bind“

Hier ist die Syntax für diese Methoden
Anruf

function bar() {
    console.log(this) // this will be global object (window)
}
bar()

Bewerben

"use strict"
function bar() {
    console.log(this) // undefined
}
bar()

Dezenter Unterschied zwischen bewerben und anrufen. Die Syntax ist dieselbe, aber wir übergeben Argumente als Array in der Apply-Methode

function bar() {
    console.log(this) // global object (window)
}
(function() {
    "use strict"
    bar()
})()

Der Aufruf von bar mit expliziter Bindung durch bar.call(..) ermöglicht es uns, zu erzwingen, dass dies ein Objekt ist.

neue Bindung

Wenn eine Funktion als Konstruktor verwendet wird (mit dem Schlüsselwort new), ist this an das neue Objekt gebunden, das erstellt wird, unabhängig davon, auf welches Objekt auf die Konstruktorfunktion zugegriffen wird. Der Wert davon wird zum Wert des neuen Ausdrucks, es sei denn, der Konstruktor gibt einen anderen nicht-primitiven Wert zurück.

function bar() {
    console.log(this)
}
const obj = {
    name: "javascript",
    foo
}
obj.foo() // this here is object owing the function

Das obige ist der detaillierte Inhalt vondieses Schlüsselwort in Javascript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!