Quoi de neuf dans la norme ES2021 pour JavaScript ?

0
169

La version annuelle d'ECMAScript est arrivée, apportant de nouvelles fonctionnalités et des améliorations de syntaxe. La spécification a été finalisée par l'organisation internationale de normalisation ECMA le 22 juin 2021, indiquant qu'elle est maintenant prête à être utilisée.

L'implémentation la plus populaire d'ECMAScript est JavaScript, le langage pris en charge par le Web. navigateurs et environnements cloud via des runtimes comme Node.js. Voici un aperçu des principaux changements apportés à ES2021.

Promise.any()

Promise.any() complète la prise en charge globale de la gestion des erreurs pour les promesses. Il court-circuitera et reviendra dès que l'un des objets Promise passés sera rempli.

Si toutes les promesses échouent, la méthode rejette avec une nouvelle AggregateError. Cet objet encapsule les motifs de rejet pour chacune des erreurs individuelles.

const promet = [doSomething(), doSomethingElse()];   essayez {   //Ce sera la valeur de retour de `doSomething()` //ou `doSomethingElse()`, selon lequel //résout le premier const firstToResolve = wait Promise.any(promises);   }   intercepter (erreurs) {   pour (erreur const d'erreurs) { //Itérer les raisons individuelles de rejet de Promesse }   }

Promise.any() est utile dans les scénarios où vous devez prendre des mesures si au moins une promesse se résout, mais peu importe si certaines échouent. Il complète les méthodes existantes Promise.all() et Promise.allSettled().

Voici un bref résumé des différences :

  • any( ) – Se résout si une promesse se résout. Rejeté si toutes les promesses sont rejetées.
  • all()– Se résout si toutes les promesses se résolvent. Rejette si une promesse est rejetée.
  • allSettled() – Se résout une fois que toutes les promesses ont été résolues ou rejetées. Cette méthode ne rejette pas.

Opérateurs d'affectation logique

ES2021 est livré avec des améliorations d'opérateurs demandées depuis longtemps. Les nouveaux opérateurs d'affectation logique fournissent un court-circuit pratique qui se traduit par moins de code à écrire.

Publicité

Les trois opérateurs (&&=, ||= et ??=) combinent leur comparaison logique correspondante avec une affectation de valeur. Vous n'avez plus besoin d'écrire deux fois le nom de la variable si vous n'attribuez que lorsque la comparaison correspond :

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

Cela permet de compléter le support de l'opérateur et de réduire la répétitivité du code lourd d'affectation. Il donne aux opérateurs logiques la même intégration d'affectation que les opérateurs mathématiques (+=, -=, *=).

String.prototype.replaceAll()

Une nouvelle méthode sur le prototype String permet de remplacer beaucoup plus facilement toutes les instances d'une sous-chaîne, sans recourir à une expression régulière. Lorsque la méthode replace() existante reçoit une chaîne en entrée, elle ne remplace que la première instance de cette valeur. replaceAll() ajoute le comportement que de nombreux développeurs ont souhaité et attendu.

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

C'est une petite fonctionnalité qui devrait avoir une utilité immédiate dans le monde réel. Un appel replaceAll() augmente la lisibilité du code par rapport à une expression régulière avec un modificateur g (global). Cela est particulièrement vrai lorsque vous travaillez avec des développeurs moins expérimentés qui ne savent peut-être pas pourquoi l'expression régulière a été utilisée.

Séparateurs numériques

A un simple changement ajoute des séparateurs numériques à la syntaxe JavaScript de base. Cela vous permet de placer des traits de soulignement entre les chiffres des nombres littéraux, ce qui les rend plus lisibles. Ils seront automatiquement supprimés lors de l'analyse de vos fichiers.

//ES2020 – C'est difficile à voir en un coup d'œil ! milliards de const = 1000000000;   //ES2021 – Cela peut être plus lisible const billion = 1_000_000_000; Publicité

Les séparateurs imitent la manière dont les virgules sont utilisées entre les groupes de nombres écrits. Leur utilisation est entièrement facultative. La syntaxe fonctionne également pour les littéraux binaires et hexadécimaux préfixés par 0b et 0x.

Fonctionnalités avancées

ES2021 inclut de nouveaux objets destinés à des cas d'utilisation plus avancés. Premièrement, il y a WeakRef, un mécanisme qui contient une référence à un objet mais le maintient éligible pour le ramasse-miettes. La référence est “faible” car il n'y a aucune garantie qu'il sera utilisable à l'avenir.

Vous pourrez accéder à l'objet jusqu'à ce qu'il soit récupéré. Il se peut que ce ne soit pas du tout un ramasse-miettes, car c'est au navigateur de supprimer les objets non référencés.

Vous créez des références faibles avec le constructeur WeakRef, en passant l'objet que vous souhaitez utiliser. Vous pouvez accéder à l'objet d'origine plus tard en appelant deref().

const x = {}; const xWeakRef = new WeakRef(x);   const deRef = xWeakRef.deref(); //c'est l'objet de `x`

Les références faibles doivent être utilisées pour mettre en cache des objets volumineux qui ne sont pas essentiels à votre application. Le navigateur pourra les nettoyer en période de faible mémoire, améliorant ainsi les performances globales.

Parallèlement aux références faibles, le nouveau constructeur FinalizationRegistry fournit des notifications lorsque les objets sont ramassés. Il n'est pas possible d'annuler le ramasse-miettes ; cette fonctionnalité est destinée à vous permettre de répondre aux nettoyages en libérant toutes les autres ressources associées. Par exemple, si un objet représentant un utilisateur a été récupéré par la mémoire, vous pouvez utiliser le rappel pour supprimer un blob mis en cache de sa photo de profil.

const register = new FinalizationRegistry(key => { //Ce rappel s'exécutera lorsqu'un //objet enregistré est récupéré si (key === "user") { //Supprimer les données utilisateur mises en cache ici. } });   const user = {Nom d'utilisateur : "CloudSavvy"}; registre.register(utilisateur, "utilisateur"); Publicité

Dans cet exemple, votre rappel s'exécutera et recevra l'utilisateur en tant que paramètre lorsque l'objet x sera récupéré par la mémoire. Vous pouvez utiliser la clé pour identifier et supprimer des données similaires. Vous devrez créer ce mécanisme vous-même.

Conclusion

ES2021 est une mise à jour saine des spécifications qui apporte de nouvelles fonctionnalités pratiques à la communauté ECMAScript. Promise.any() complète la gamme de traitement des promesses, tandis que les opérateurs d'affectation logique et replaceAll() améliorent la facilité d'utilisation au quotidien.

Bien qu'à peine finalisées, les fonctionnalités ES2021 ont été livrées dans les navigateurs toute l'année. . Chromium, Firefox et Safari offrent déjà une prise en charge complète d'ES2021, vous pouvez donc écrire du code en utilisant les nouvelles fonctionnalités dès aujourd'hui. Des fonctionnalités telles que Promise.any() et String.prototype.replaceAll() peuvent être facilement remplies pour les navigateurs plus anciens ; d'autres, comme les opérateurs d'affectation logique, peuvent être gérés par des préprocesseurs comme Babel.