Heim >Web-Frontend >js-Tutorial >Pfeilfunktionen => Was stimmt mit den regulären nicht?
Was stimmt mit den regulären nicht?" />
Wenn Sie Ihre JavaScript-Kenntnisse erweitern und sich fragen, warum sie jemals Pfeilfunktionen in ECMAScript 2015 (ES6) hinzufügen würden, sind Sie nicht allein. Als ich mein Wissen über die Sprache und ihre Feinheiten und Eigenheiten vertiefte, stellte ich fest, dass ich mich das Gleiche fragte. In diesem Beitrag werde ich die Unterschiede, Vorteile und Gründe darlegen, warum es hinzugefügt wurde und wann Sie es verwenden sollten.
Bevor Pfeilfunktionen eingeführt wurden, mussten Funktionen im traditionellen Format wie folgt deklariert werden:
function add(x, y) { return x + y; }
oder als Ausdruck deklariert:
const addFunction = function add(x, y) { return x + y; }
Mit der Einführung von Pfeilfunktionen kann dies wie folgt geschrieben werden:
const addFunction = (x,y) => x + y
Aus dem obigen Beispiel können wir leicht erkennen, dass die Funktion durch die Verwendung einer Pfeilfunktion und die Nutzung ihrer impliziten Rückgabefunktion schnell in eine einzelne Zeile umgestaltet werden kann. Der resultierende Code ist prägnanter, sauberer und leichter zu lesen, was zu einer reibungsloseren Entwicklung und einem schnelleren Debugging führt.
Die JavaScript-Laufzeitumgebung hebt standardmäßig alle Funktionen und Variablendeklarationen an die Spitze ihres Gültigkeitsbereichs, wenn der Ausführungskontext erstellt wird. Im globalen Geltungsbereich wird dadurch beispielsweise sichergestellt, dass alle deklarierten Funktionen und Variablen allen später aufgerufenen Funktionen zur Verfügung stehen. Pfeilfunktionen werden jedoch niemals angehoben, was eine bessere Kontrolle über den genauen Ort ermöglicht, an dem eine Funktion ausgeführt wird, und über die Variablen, auf die sie Zugriff hat.
Jedes Mal, wenn eine JavaScript-Funktion ausgeführt wird, wird ein Ausführungskontext erstellt, der Informationen über die Umgebung enthält, in der die Funktion ausgeführt wird, einschließlich des Werts von diesem. Während eine herkömmliche Funktion in ihrem eigenen Kontext ausgeführt wird, erbt eine Pfeilfunktion immer den Kontext der Funktion, die sie aufgerufen hat.
Verwenden Sie den folgenden Code:
class Person { constructor(){ this.name = "George"; this.greetings = ["Good Morning,","Hello!","Howdy!"]; } printGreetings(){ this.greetings.forEach(function print(greet){ console.log(`${greet} ${this.name}`); }); } } let person = new Person(); person.printGreetings();
Wir würden eine Fehlermeldung erhalten, die besagt: Die Eigenschaft „forEach“ von undefiniert kann nicht gelesen werden. Dies liegt daran, dass sich die Funktion „printGreetings“ zwar im Kontext der Klasse „Person“ befindet und deren Kontext erbt, die Funktion „forEach“ jedoch (obwohl ihre eine integrierte JavaScript-Funktion) wird in einem eigenen Kontext ausgeführt, der die Eigenschaft „this.name“ nicht enthält, was zu einer Suche führt Fehler.
Eine Pfeilfunktion wird jedoch niemals in ihrem eigenen Kontext ausgeführt, und indem die obige Funktion mithilfe einer Pfeilfunktion umgeschrieben wird ...
printGreetings(){ this.greetings.forEach((greet) => { console.log(`${greet} ${this.name}`); }); }
Das Ergebnis wird wie erwartet sein
function add(x, y) { return x + y; }
Um die Vorteile von Pfeilfunktionen zusammenzufassen: sie ermöglichen kürzeren und prägnanteren Code; bietet implizite Rückgabe von Funktionsblockcode; wird nicht an die Spitze des Ausführungskontexts gehoben und behält seine genaue Position im Code bei; Schließlich erben sie den Kontext der Funktion, die sie aufgerufen hat, ohne ihren eigenen Kontext auszuführen, was eine vorhersehbarere Verwendung dieses Schlüsselworts ermöglicht.
Hoffentlich hat Ihnen dieser Beitrag dabei geholfen, die Unterschiede und Vorteile traditioneller Funktionen gegenüber Pfeilfunktionen besser zu verstehen, und Sie auf Ihrer JavaScript-Reise einen Schritt weitergebracht!
Weiterführende Literatur:
Dmitri Pavlutin Blog – Unterschiede zwischen Pfeil- und regulären Funktionen
MDN-Referenzdokumente – Pfeilfunktionen
Das obige ist der detaillierte Inhalt vonPfeilfunktionen => Was stimmt mit den regulären nicht?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!