JavaScript moderne : ES2024 et au-delà

javaScript évolue rapidement avec de nouvelles fonctionnalités chaque année. Découvrez les nouveautés d'ES2024 et comment les utiliser dans vos projets.

Depuis plusieurs années, JavaScript (ECMAScript) continue de gagner en puissance, simplicité, et expressivité. L’édition ES2024 ne fait pas exception. Voici un tour d’horizon des fonctionnalités les plus attendues ou déjà disponibles, et comment en tirer parti dans vos projets dès aujourd’hui.

1. Set methods – Des méthodes utiles enfin disponibles

Les ensembles (Set) gagnent enfin des méthodes utilitaires natives ! Fini les conversions manuelles en Array pour faire des opérations classiques comme l’union ou l’intersection.

js

const a = new Set([1, 2, 3]);
const b = new Set([2, 3, 4]);

Set.union(a, b);       // Set {1, 2, 3, 4}
Set.intersection(a, b); // Set {2, 3}
Set.difference(a, b);   // Set {1}
Set.symmetricDifference(a, b); // Set {1, 4}

✅ Ces méthodes rendent les opérations sur les ensembles plus lisibles et plus performantes.

2. Array.prototype.toSorted() / toReversed() (déjà en ES2023)

Bien qu’introduites en ES2023, elles sont encore peu connues. Elles permettent de ne pas muter l’array original (contrairement à sort() ou reverse()).

js

const numbers = [3, 1, 4];
const sorted = numbers.toSorted();   // [1, 3, 4]
const original = numbers;            // [3, 1, 4]

🔒 Idéal pour la programmation fonctionnelle et éviter les effets de bord.

3. Promise.withResolvers() – Plus de contrôle sur vos promesses

Cette méthode permet de créer une promesse avec son resolve et reject externes, sans devoir créer un wrapper soi-même.

js

const { promise, resolve, reject } = Promise.withResolvers();

setTimeout(() => resolve('OK'), 1000);


await promise; // "OK"

✨ Très pratique pour des systèmes d’attente ou d’ordonnancement personnalisés.

4. Importation de modules via import attributes

ES2024 introduit la possibilité de passer des attributs lors d’un import, notamment utile pour charger des JSON ou du contenu en tant que module.

js

import data from './config.json' with { type: 'json' };

🔐 Plus sécurisé et standardisé, particulièrement utile dans les navigateurs modernes.

5. Temporal API (proposée mais très attendue)

Bien que toujours en proposition, l’API Temporal vise à remplacer Date, trop imprécise et difficile à manipuler.

js

const now = Temporal.Now.plainDateTimeISO();
const later = now.add({ days: 3 });

📅 Temporal promet une gestion des dates plus fiable, internationale et sans les bugs de Date.

6. Pipeline operator (|>) –

Toujours en discussion mais prometteur , Syntaxe fonctionnelle très attendue :

js

const result = value
  |> double
  |> square
  |> toString;

✅ Rend les transformations de données plus lisibles, dans un style proche de celui de Elm ou Elixir.

📌 En résumé : les bonnes pratiques 2024
✅ Ce que vous pouvez adopter dès maintenant :

Set.union, Set.intersection, etc.

toSorted, toReversed

Promise.withResolvers

import ... with { type: 'json' }

🧪 À surveiller pour demain :

Temporal

Pipeline operator

Pattern matching (stage 3 actuellement)

🚀 Comment les utiliser dans vos projets ?
Activez les flags expérimentaux dans Node.js pour certaines fonctionnalités :

node --harmony script.js

Utilisez Babel ou SWC pour transpiler certaines fonctionnalités futures.

Vérifiez le support navigateur avec Can I use.