Wie gehen Pfeilfunktionen in JavaScript mit „dieser' Bindung um und was sind die Problemumgehungen?

Pfeilfunktionen und Bindung: Das „dieses“-Verhalten entmystifizieren

Pfeilfunktionen, eine moderne JavaScript-Funktion, bieten eine prägnante Syntax zum Deklarieren von Funktionen. Ein bemerkenswerter Unterschied zwischen Pfeilfunktionen und regulären Funktionen ist jedoch ihr Verhalten in Bezug auf die „diese“-Bindung.

„diese“-Bindung in Pfeilfunktionen

Pfeilfunktionen erstellen keine eigene „diese“-Bindung . Stattdessen erben sie es vom umschließenden Bereich. Das bedeutet, dass sich „this“ in einer Pfeilfunktion auf denselben Wert bezieht wie „this“ in der umgebenden Funktion oder im globalen Bereich.

Ein Beispiel für ungebundenes „this“

Betrachten Sie das bereitgestellte Beispiel in der Frage:

var f = () => console.log(this);

Hier ist „this“ in der Pfeilfunktion „f“ ungebunden. Wenn „f“ aufgerufen wird, verwendet es die „this“-Bindung des globalen Bereichs, die normalerweise auf das Fensterobjekt verweist. Infolgedessen würde der Aufruf von „fBound()“ wie beabsichtigt das Fensterobjekt anstelle des „o“-Objekts protokollieren.

Bindung von „this“ in Pfeilfunktionen

Während Pfeilfunktionen nicht unterstützt werden Bei der traditionellen Bindung mit „bind“ gibt es alternative Ansätze, um eine ähnliche Funktionalität zu erreichen:

• Verwendung regulärer Funktionen: Definieren eine reguläre Funktion als Vermittler, die „this“ an das gewünschte Objekt bindet, bevor eine Pfeilfunktion zurückgegeben wird:

var fBound = () => {
  console.log(this);
}.bind(o);

• Verwenden von ES6-Klassen: Definieren Sie eine Klasse, die stellt die gewünschte „This“-Bindung bereit und verwendet Pfeilfunktionen als Methoden:

class MyClass {
  constructor() {
    this.f = () => console.log(this);
  }
}

const o = new MyClass();
o.f(); // logs the 'o' object

Zusammenfassend lässt sich sagen, dass Pfeilfunktionen zwar viele Vorteile bieten, Sie verhalten sich in Bezug auf „diese“ Bindung anders als bei regulären Funktionen. Wenn Sie diese Unterscheidung verstehen, können Sie Pfeilfunktionen und alternative Ansätze effektiv nutzen, um die gewünschte „diese“ Bindung zu erreichen.

Das obige ist der detaillierte Inhalt vonWie gehen Pfeilfunktionen in JavaScript mit „dieser' Bindung um und was sind die Problemumgehungen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!