Heim >Web-Frontend >js-Tutorial >Warum sollten Sie Pfeilfunktionen beim Definieren von ES6-Objektmethoden vermeiden?
Pfeilfunktionen in ES6-Objekten verwenden
In ES6 gibt es zwei Möglichkeiten, Objektmethoden zu definieren: die Verwendung der traditionellen Funktionssyntax und die Verwendung der Kurzschrift bilden. Beide Methoden sind gültig:
var chopper = { owner: 'Zed', getOwner: function() { return this.owner; } };
var chopper = { owner: 'Zed', getOwner() { return this.owner; } }
Die Verwendung von Pfeilfunktionen in Objektmethoden stellt jedoch eine andere Geschichte dar. Lassen Sie uns das genauer untersuchen.
Pfeilfunktionen und Objektmethoden
Pfeilfunktionen eignen sich nicht zum Definieren von Objektmethoden. Dies liegt daran, dass sie den this-Wert des umgebenden lexikalischen Kontexts erben, der möglicherweise nicht mit dem this-Wert innerhalb des Objekts übereinstimmt.
Betrachten Sie beispielsweise den folgenden Code:
var chopper = { owner: 'John', getOwner: () => { return this.owner; } };
In diesem Beispiel bezieht sich dies innerhalb der getOwner-Methode auf das Fensterobjekt (oder das globalThis-Objekt im strikten Modus), nicht auf das Chopper-Objekt. Infolgedessen gibt der this.owner-Ausdruck undefiniert zurück und wirft einen Fehler aus.
Traditionelle Funktionssyntax vs. ES6-Methodensyntax
Für die Definition von Objektmethoden ist dies der Fall Es empfiehlt sich, die traditionelle Funktionssyntax oder die ES6-Methodensyntax zu verwenden, die beide den Wert this innerhalb der Methode explizit definieren.
Hier ist ein Beispiel mit traditioneller Verwendung Funktionssyntax:
var chopper = { owner: 'Zed', getOwner: function() { return this.owner; } };
Und hier ist ein Beispiel mit der ES6-Methodensyntax:
var chopper = { owner: 'Zed', getOwner() { return this.owner; } };
Diese Methoden verwenden das Schlüsselwort this, um auf das aktuelle Objekt zu verweisen und stellen so sicher, dass der Ausdruck this.owner gibt den korrekten Wert zurück.
Fazit
Während Pfeilfunktionen eine prägnante Darstellung bieten Syntax zum Definieren einfacher Funktionen, sie sind nicht für die Verwendung als Objektmethoden in ES6 geeignet. Zu diesem Zweck wird empfohlen, sich an die traditionelle Funktionssyntax oder die ES6-Methodensyntax zu halten, die beide eine klarere und zuverlässigere Möglichkeit bieten, Methoden für Objekte zu definieren.
Das obige ist der detaillierte Inhalt vonWarum sollten Sie Pfeilfunktionen beim Definieren von ES6-Objektmethoden vermeiden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!