Was ist neu im ES2021-Standard für JavaScript?

0
179

Die jährliche Version von ECMAScript ist da und bringt neue Funktionen und Syntaxverbesserungen. Die Spezifikation wurde am 22. Juni 2021 von der ECMA International Standards Organization fertiggestellt und ist nun einsatzbereit.

ECMAScripts beliebteste Implementierung ist JavaScript, die vom Web unterstützte Sprache Browser und Cloud-Umgebungen über Laufzeiten wie Node.js. Hier ein Überblick über die wichtigsten Änderungen in ES2021.

Promise.any()

Promise.any() vervollständigt die Unterstützung der aggregierten Fehlerbehandlung für Versprechen. Es wird kurzgeschlossen und kehrt zurück, sobald eines der übergebenen Promise-Objekte erfüllt ist.

Wenn alle Zusagen fehlschlagen, lehnt die Methode mit einem neuen AggregateError ab. Dieses Objekt kapselt die Ablehnungsgründe für jeden der einzelnen Fehler.

const Promises = [doSomething(), doSomethingElse()];   versuche es mit {   //Dies ist der Rückgabewert von `doSomething()` //oder `doSomethingElse()`, je nachdem welches //zuerst auflöst const firstToResolve = wait Promise.any(promises);   }   (Fehler) {   für (const error of error) { //Iteriere die einzelnen Ablehnungsgründe für das Versprechen }   }

Promise.any() ist in Szenarien nützlich, in denen Sie Maßnahmen ergreifen müssen, wenn mindestens ein Promise aufgelöst wird, aber es spielt keine Rolle, wenn einige fehlschlagen. Es ergänzt die bestehenden Methoden Promise.all() und Promise.allSettled().

Hier eine kurze Zusammenfassung der Unterschiede:

  • any( ) – Wird aufgelöst, wenn ein Versprechen eingelöst wird. Wird abgelehnt, wenn alle Zusagen abgelehnt werden.
  • all()– Wird gelöst, wenn alle Versprechen eingelöst werden. Wird abgelehnt, wenn eine Zusage abgelehnt wird.
  • allSettled() – Wird aufgelöst, sobald alle Zusagen aufgelöst oder abgelehnt wurden. Diese Methode lehnt nicht ab.

Logische Zuweisungsoperatoren

ES2021 enthält einige seit langem geforderte Operatorverbesserungen. Neue logische Zuweisungsoperatoren ermöglichen ein bequemes Kurzschließen, wodurch weniger Code geschrieben werden muss.

Werbung

Die drei Operatoren (&&=, ||= und ??=) kombinieren ihren entsprechenden logischen Vergleich mit einer Wertzuweisung. Sie müssen den Variablennamen nicht mehr zweimal schreiben, wenn Sie nur zuweisen, wenn der Vergleich übereinstimmt:

//ES2020 x && (x = y) x || (x = y) x = x ?? y   //ES2021 x &&= y; x ||= y; x ??= y;

Dies trägt zur Abrundung der Bedienerunterstützung bei und reduziert die Wiederholbarkeit von zuweisungslastigem Code. Es gibt logischen Operatoren die gleiche Zuweisungsintegration wie die mathematischen Operatoren (+=, -=, *=).

String.prototype.replaceAll()

Eine neue Methode des String-Prototyps macht es viel einfacher, alle Instanzen eines Teilstrings zu ersetzen, ohne auf eine Regex zurückgreifen zu müssen. Wenn die vorhandene replace()-Methode als Eingabe einen String erhält, ersetzt sie nur die erste Instanz dieses Werts. replaceAll() fügt das Verhalten hinzu, das viele Entwickler wollten und erwartet haben.

const str = “xxxyz”;   //xxyz console.log(str.replace("x", ""));   //yz console.log(/x/g, "");   //yz console.log(str.replaceAll("x", ""));

Es ist ein kleines Feature, das sofortigen praktischen Nutzen haben sollte. Ein Aufruf von replaceAll() erhöht die Lesbarkeit von Code im Vergleich zu einer Regex mit einem g (globalen) Modifikator. Dies gilt insbesondere, wenn Sie mit weniger erfahrenen Entwicklern zusammenarbeiten, die möglicherweise nicht wissen, warum die Regex verwendet wurde.

Numerische Trennzeichen

A einfache Änderung fügt der grundlegenden JavaScript-Syntax numerische Trennzeichen hinzu. Auf diese Weise können Sie Unterstriche zwischen Ziffern in Literalzahlen platzieren, um sie besser lesbar zu machen. Sie werden beim Parsen Ihrer Dateien automatisch entfernt.

//ES2020 – Das ist auf den ersten Blick schwer zu erkennen! const Milliarde = 1000000000;   //ES2021 – Dies kann besser lesbar sein const Milliarde = 1_000_000_000; Werbung

Trennzeichen ahmen die Art und Weise nach, in der Kommas zwischen Gruppen geschriebener Zahlen verwendet werden. Ihre Verwendung ist völlig optional. Die Syntax funktioniert auch für binäre und hexadezimale Literale mit den Präfixen 0b und 0x.

Erweiterte Funktionen

ES2021 enthält einige neue Objekte, die auf fortgeschrittenere Anwendungsfälle ausgerichtet sind. Erstens gibt es WeakRef, einen Mechanismus, der eine Referenz auf ein Objekt enthält, es aber für die Garbage Collection in Frage stellt. Die Referenz ist “schwach” da es keine Garantie dafür gibt, dass es in Zukunft verwendet werden kann.

Sie können auf das Objekt zugreifen, bis es Müll gesammelt hat. Es wird möglicherweise überhaupt nicht nach dem Garbage-Collection-System gespeichert, da es am Browser liegt, nicht referenzierte Objekte zu entfernen.

Sie erstellen schwache Referenzen mit dem WeakRef-Konstruktor und übergeben das Objekt, das Sie verwenden möchten. Sie können später auf das Originalobjekt zugreifen, indem Sie deref() aufrufen.

const x = {}; const xWeakRef = new WeakRef(x);   const deRef = xWeakRef.deref(); //Dies ist das Objekt von `x`

Schwache Referenzen sollten verwendet werden, um große Objekte zwischenzuspeichern, die für Ihre Anwendung nicht unbedingt erforderlich sind. Der Browser kann sie in Zeiten mit wenig Speicher bereinigen, wodurch die Gesamtleistung verbessert wird.

Neben schwachen Verweisen stellt der neue FinalizationRegistry-Konstruktor Benachrichtigungen bereit, wenn Objekte Garbage Collection werden. Es ist nicht möglich, die Garbage Collection abzubrechen; Mit dieser Funktion können Sie auf Bereinigungen reagieren, indem Sie alle anderen zugehörigen Ressourcen freigeben. Wenn beispielsweise ein Objekt, das einen Benutzer darstellt, von der Garbage Collection erfasst wurde, können Sie den Callback verwenden, um einen zwischengespeicherten Blob seines Profilbilds zu löschen.

const Registry = new FinalizationRegistry(key => { //Dieser Callback wird ausgeführt, wenn ein //registriertes Objekt Garbage Collection ist, wenn (key === "user") { //Hier zwischengespeicherte Benutzerdaten löschen. } });   const user = {Benutzername: "CloudSavvy"}; Registry.register(Benutzer, "Benutzer"); Werbung

In diesem Beispiel wird Ihr Rückruf ausgeführt und erhält user als Parameter, wenn das x-Objekt Garbage Collection ist. Sie können den Schlüssel verwenden, um ähnliche Daten zu identifizieren und zu entfernen. Sie müssen diesen Mechanismus selbst erstellen.

Schlussfolgerung

ES2021 ist ein gesundes Spezifikationsupdate, das der ECMAScript-Community neue Komfortfunktionen bietet. Promise.any() vervollständigt die Palette der Versprechensbehandlung, während logische Zuweisungsoperatoren und replaceAll() die tägliche Benutzerfreundlichkeit verbessern.

Obwohl die ES2021-Funktionen gerade erst fertiggestellt wurden, werden sie das ganze Jahr über in Browsern ausgeliefert . Chromium, Firefox und Safari bieten bereits volle ES2021-Unterstützung, sodass Sie heute Code mit den neuen Funktionen schreiben können. Funktionen wie Promise.any() und String.prototype.replaceAll() können für ältere Browser leicht mehrfach gefüllt werden; andere wie logische Zuweisungsoperatoren können von Präprozessoren wie Babel verarbeitet werden.