Diese neuen JavaScript Funktionen kommen dank ES2022 / ES13
Es ist so weit, das Ecma TC39 Komitee hat die neuen Funktionalitäten von ES2022 veröffentlicht, welche traditionsgemäß im Juni des Jahres erscheinen. Wir freuen uns, dass unsere Sprache der Wahl JavaScript, mit der wir für euch individuelle Softwarelösungen entwickeln, ein Update und somit mehr an Funktionalität erhält.
Bitte beachtet, wenn ihr Produktiv-Software mit den neuen Funktionalitäten ausstatten wollt, so denkt an Polyfills um auch ältere Browser zu unterstützen.
Top-Level await für Module
Fortan kann await ohne async für Module benutzt werden. Das Hilfskonstrukt IFFE mit async Keyword, ohne welches ein await bis zu ES2022 nicht genutzt werden konnte, gehört nun der Vergangenheit an.
Beachtet, dass Top-Level await nur für Module verfügbar ist
- Es ist also notwendig ein .mjs File anstelle eines .js Files zu verwenden oder
- in der package.json den type auf “module” anstelle commonJS zu stellen
Neue Member von Klassen
ES13 ermöglicht es private und static Member in Klassen zu deklarieren, außerdem ist die Deklaration von public Variablen im Body der Klasse nicht mehr notwendig. Die Instanziierung kann direkt im Constructor erfolgen. Neben dem static Keyword führt ES13 auch static Blocks ein, diese ermöglichen static Variablen dynamisch zu initialisieren.
Private Members
- Private member erhalten bei uns in Projekten ein Underscore “_privateVariable” als Prefix, dies ist jedoch nur eine Konvention und keine Regel. Ein Zugriff außerhalb der Klasse ist noch möglich.
- In ES13 ist es möglich mittels eines Hash “#privateVariable” als Prefix, private Variablen und Methoden von außerhalb nicht zugänglich zu machen.
Instanziierung von public Variablen
- Es ist nun möglich public Variablen direkt im Constructor zu instanziieren ohne das diese im Body der Klasse deklariert sind. Für private Variablen gilt, dass diese im Body der Klasse bekannt sein müssen.
Static Keyword
- Für statische Variablen & Methoden gibt es nun ein Keyword. Außerdem stellt ES2022 Blocks für die Initialisierung von statischen Variablen bereit, das ist zB. notwendig wenn die statische Variable in Abhängigkeit von einer anderen Variable initialisiert werden muss.
Error cause
Das Verketten von Fehlermeldungen ist nun dank dem cause property um einiges einfacher.
Methode für Arrays & Strings .at()
Die neue Methode .at() erlaubt uns mittels des Index auf einen Eintrag innerhalb eines Array zuzugreifen. Dies hat zum Vorteil, dass wir hier auch mit negativen Werten arbeiten können. Die Methode lässt sich ebenso für Strings anwenden.
Match Indizes
Match Indizes sind eine Eigenschaft von Match-Objekten: Wenn wir diese über das Flag /d für reguläre Ausdrücke (Eigenschaft .hasIndices) einschalten, werden die Anfangs- und Endindizes der zutreffenden Gruppen erfasst.
Object Methode .hasOwn()
Eine sichere Möglichkeit zur Überprüfung, ob ein Property vorhanden ist, bietet die neue ES13 Methode .hasOwn(). Die Methode ist nicht nur um einiges leserlicher sondern funktioniert im Gegensatz zu Object.prototype.hasOwnProperty auch mit allen Objekten.
Summary
Wir freuen uns auf die kommenden Erweiterungen der Sprache JavaScript.
Sie gestalten den Code nicht nur leserlicher, sondern stellen auch native Funktionalitäten wie private und static Variablen oder Top-Level await bereit die bis dato nur durch Supersets wie TypeScript zur Verfügung gestanden sind.
Wenn ihr nochmal alle Funktionen im Detail lesen möchtet, so findet ihr diese hier.