ECMAScript 2025 : Les Nouvelles Fonctionnalités JavaScript Que Vous Devez Connaître
Salut HaWkers, la mise à jour annuelle de JavaScript est là et apporte avec elle l'une des plus grandes collections de nouvelles fonctionnalités de ces dernières années. ECMAScript 2025 inclut des fonctionnalités que les développeurs réclament depuis longtemps, depuis les méthodes natives pour la manipulation d'itérateurs jusqu'aux améliorations significatives des Sets et Promises.
Avez-vous déjà ressenti le besoin d'une bibliothèque externe pour faire des opérations simples avec des itérateurs ? Ou que l'API Set de JavaScript était trop limitée ? L'ES2025 résout ces problèmes de manière élégante et native.
Iterator Helpers : La Star de l'ES2025
L'ajout principal d'ECMAScript 2025 est le nouvel objet Iterator avec ses méthodes fonctionnelles. Vous pouvez maintenant chaîner des opérations comme map, filter, take et reduce directement sur les itérateurs.
Pourquoi C'est Révolutionnaire
Avant l'ES2025, travailler avec des itérateurs était verbeux et nécessitait souvent une conversion en arrays :
// Avant ES2025 - Il fallait convertir en Array
function* genererNombres(limite) {
for (let i = 0; i < limite; i++) {
yield i;
}
}
// Conversion inutile pour utiliser map/filter
const resultat = [...genererNombres(1000)]
.filter(n => n % 2 === 0)
.map(n => n * 2)
.slice(0, 10);Le problème ? Vous allouez de la mémoire pour 1000 éléments alors que vous n'en avez besoin que de 10. Avec Iterator Helpers, l'évaluation est paresseuse (lazy) :
// ES2025 - Évaluation paresseuse native
function* genererNombres(limite) {
for (let i = 0; i < limite; i++) {
yield i;
}
}
const resultat = genererNombres(1000)
.filter(n => n % 2 === 0)
.map(n => n * 2)
.take(10)
.toArray();
// Ne traite que les éléments nécessaires !Méthodes Disponibles sur Iterator
L'ES2025 ajoute diverses méthodes au prototype d'Iterator :
// map - Transforme chaque élément
const doubles = [1, 2, 3].values().map(x => x * 2).toArray();
// [2, 4, 6]
// filter - Filtre les éléments
const pairs = [1, 2, 3, 4, 5].values().filter(x => x % 2 === 0).toArray();
// [2, 4]
// take - Prend les N premiers éléments
const premiers = [1, 2, 3, 4, 5].values().take(3).toArray();
// [1, 2, 3]
// drop - Saute les N premiers éléments
const derniers = [1, 2, 3, 4, 5].values().drop(2).toArray();
// [3, 4, 5]
// flatMap - Map qui aplatit le résultat
const aplati = [[1, 2], [3, 4]].values()
.flatMap(arr => arr.values())
.toArray();
// [1, 2, 3, 4]
// reduce - Réduit à une seule valeur
const somme = [1, 2, 3, 4].values().reduce((acc, val) => acc + val, 0);
// 10
// forEach - Exécute une action pour chaque élément
[1, 2, 3].values().forEach(x => console.log(x));
// some - Vérifie si un élément satisfait la condition
const aPair = [1, 3, 5, 6].values().some(x => x % 2 === 0);
// true
// every - Vérifie si tous satisfont la condition
const tousPairs = [2, 4, 6].values().every(x => x % 2 === 0);
// true
// find - Trouve le premier élément satisfaisant la condition
const premierPair = [1, 3, 4, 6].values().find(x => x % 2 === 0);
// 4Chaînage Puissant
Le vrai pouvoir réside dans le chaînage d'opérations :
// Pipeline complexe avec évaluation paresseuse
function* genererDonneesUtilisateurs() {
let id = 1;
while (true) {
yield {
id: id++,
nom: `Utilisateur ${id}`,
actif: Math.random() > 0.5,
age: Math.floor(Math.random() * 60) + 18
};
}
}
const utilisateursTraites = genererDonneesUtilisateurs()
.filter(u => u.actif) // Seulement les actifs
.filter(u => u.age >= 25) // Plus de 25 ans
.map(u => ({ // Transforme l'objet
...u,
categorie: u.age > 40 ? 'senior' : 'junior'
}))
.take(50) // Prend seulement 50
.toArray();
// Même avec un générateur infini, ne traite que le nécessaire !Nouvelles Méthodes de Set
Enfin JavaScript a des opérations d'ensembles natives ! L'ES2025 ajoute des méthodes que les développeurs ont toujours eues besoin.
Union, Intersection et Difference
const setA = new Set([1, 2, 3, 4]);
const setB = new Set([3, 4, 5, 6]);
// union - Tous les éléments des deux
const union = setA.union(setB);
// Set {1, 2, 3, 4, 5, 6}
// intersection - Éléments en commun
const intersection = setA.intersection(setB);
// Set {3, 4}
// difference - Éléments dans A mais pas dans B
const difference = setA.difference(setB);
// Set {1, 2}
// symmetricDifference - Éléments exclusifs à chacun
const diffSymetrique = setA.symmetricDifference(setB);
// Set {1, 2, 5, 6}Méthodes de Vérification
const petit = new Set([1, 2]);
const grand = new Set([1, 2, 3, 4, 5]);
const separe = new Set([6, 7, 8]);
// isSubsetOf - Vérifie si c'est un sous-ensemble
petit.isSubsetOf(grand); // true
// isSupersetOf - Vérifie si c'est un sur-ensemble
grand.isSupersetOf(petit); // true
// isDisjointFrom - Vérifie s'il n'y a pas d'éléments en commun
petit.isDisjointFrom(separe); // trueCas d'Utilisation Pratique
// Gestion des permissions avec Sets
const permissionsAdmin = new Set(['creer', 'lire', 'modifier', 'supprimer', 'gerer']);
const permissionsEditeur = new Set(['creer', 'lire', 'modifier']);
const permissionsUtilisateur = new Set(['lire']);
function verifierAcces(permissionsRequises, permissionsDeUtilisateur) {
// Toutes les permissions requises doivent être dans celles de l'utilisateur
return permissionsRequises.isSubsetOf(permissionsDeUtilisateur);
}
function listerPermissionsManquantes(requises, actuelles) {
return requises.difference(actuelles);
}
const requises = new Set(['creer', 'lire']);
console.log(verifierAcces(requises, permissionsUtilisateur)); // false
console.log(listerPermissionsManquantes(requises, permissionsUtilisateur));
// Set {'creer'}Promise.try : Simplifier les Chaînes
La nouvelle méthode Promise.try permet de démarrer une chaîne de Promise de manière plus propre, capturant tant les erreurs synchrones qu'asynchrones.
Le Problème Qu'il Résout
// Avant ES2025 - Les erreurs synchrones s'échappent
function traiterDonnees(input) {
// Si cette ligne lance une erreur, elle n'est pas capturée
const valide = validerSync(input);
return chercherDonnees(valide);
}
// Il fallait faire ceci :
function traiterDonneesSecurise(input) {
return Promise.resolve().then(() => {
const valide = validerSync(input);
return chercherDonnees(valide);
});
}// ES2025 - Promise.try capture tout
function traiterDonnees(input) {
return Promise.try(() => {
const valide = validerSync(input); // Erreur synchrone capturée
return chercherDonnees(valide); // Erreur asynchrone capturée
});
}
// Utilisation
traiterDonnees(donnees)
.then(resultat => console.log(resultat))
.catch(erreur => console.error('Erreur capturée:', erreur));Comparaison Directe
// Sans Promise.try
async function exempleAncien(callback) {
try {
// callback peut lancer une erreur synchrone
return await Promise.resolve(callback());
} catch (e) {
throw e;
}
}
// Avec Promise.try
function exempleNouveau(callback) {
return Promise.try(callback);
}
// Les deux font la même chose, mais Promise.try est plus concisFloat16Array : Nouveau Type de Tableau Typé
Pour les développeurs travaillant avec le machine learning et les graphiques, l'ES2025 introduit Float16Array.
// Float16 utilise la moitié de la mémoire de Float32
const float16 = new Float16Array([1.5, 2.5, 3.5]);
const float32 = new Float32Array([1.5, 2.5, 3.5]);
console.log(float16.BYTES_PER_ELEMENT); // 2
console.log(float32.BYTES_PER_ELEMENT); // 4
// Utile pour les tenseurs en ML où la précision extrême n'est pas nécessaire
const tenseurGrand = new Float16Array(1000000);
// Utilise ~2Mo au lieu de ~4MoCas d'Utilisation en WebGL
// Données de sommets avec Float16 économisent la mémoire GPU
const sommets = new Float16Array([
// x, y, z, u, v (position + texture)
-1.0, -1.0, 0.0, 0.0, 0.0,
1.0, -1.0, 0.0, 1.0, 0.0,
1.0, 1.0, 0.0, 1.0, 1.0,
-1.0, 1.0, 0.0, 0.0, 1.0,
]);
// Upload vers le GPU
gl.bufferData(gl.ARRAY_BUFFER, sommets, gl.STATIC_DRAW);Regex Escaping
L'ES2025 ajoute une méthode native pour échapper les caractères spéciaux dans les expressions régulières.
// Avant - Il fallait une fonction manuelle
function escaperRegex(chaine) {
return chaine.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
}
// ES2025 - Méthode native
const entreeUtilisateur = "Prix: 10,00€ (réduction?)";
const pattern = RegExp.escape(entreeUtilisateur);
// "Prix:\\10,00€\\(réduction\\?\\)"
const regex = new RegExp(pattern);Utilisation Pratique en Recherche
function creerChercheur(terme) {
const termeEchappe = RegExp.escape(terme);
return new RegExp(termeEchappe, 'gi');
}
const texte = "Le prix est 50,00€ (cinquante euros)";
const recherche = creerChercheur("50,00€");
console.log(texte.match(recherche)); // ["50,00€"]Groupes de Capture Nommés Dupliqués
Vous pouvez maintenant utiliser le même nom de groupe de capture dans différentes parties d'une expression régulière alternative.
// Avant - Erreur : groupe dupliqué
// const regex = /(?<annee>\d{4})|(?<annee>\d{2})/; // SyntaxError
// ES2025 - Permis quand dans des alternatives
const regex = /(?<annee>\d{4})-(?<mois>\d{2})|(?<mois>\d{2})\/(?<annee>\d{2})/;
// Fonctionne pour différents formats de date
"2025-12".match(regex).groups; // { annee: "2025", mois: "12" }
"12/25".match(regex).groups; // { annee: "25", mois: "12" }Parser de Dates Flexible
const dateFlexible = /^(?:(?<annee>\d{4})-(?<mois>\d{2})-(?<jour>\d{2})|(?<jour>\d{2})\/(?<mois>\d{2})\/(?<annee>\d{4}))$/;
function parserDate(str) {
const match = str.match(dateFlexible);
if (!match) return null;
const { annee, mois, jour } = match.groups;
return new Date(parseInt(annee), parseInt(mois) - 1, parseInt(jour));
}
parserDate("2025-12-14"); // Objet Date
parserDate("14/12/2025"); // Objet Date (même résultat)Support dans les Navigateurs
Les nouvelles fonctionnalités de l'ES2025 sont implémentées progressivement. Voici le statut actuel :
| Fonctionnalité | Chrome | Firefox | Safari | Node.js |
|---|---|---|---|---|
| Iterator Helpers | 122+ | 131+ | 17.4+ | 22+ |
| Set Methods | 122+ | 127+ | 17.0+ | 22+ |
| Promise.try | En développement | En développement | En développement | 22+ |
| Float16Array | 124+ | En développement | En développement | 22+ |
| RegExp.escape | En développement | En développement | En développement | En développement |
Pour utiliser les fonctionnalités avant le support universel, considérez les transpilateurs et polyfills comme core-js.
Conclusion
ECMAScript 2025 apporte des améliorations significatives qui rendent JavaScript plus expressif et puissant. Les Iterator Helpers seuls représentent l'un des plus grands ajouts à la langage depuis des années, permettant un code plus propre et efficace.
Si vous travaillez avec JavaScript, commencez à expérimenter ces fonctionnalités dans des projets personnels et préparez-vous à les utiliser en production à mesure que le support des navigateurs s'étend.
Si vous voulez continuer à mettre à jour vos connaissances en JavaScript, je recommande de jeter un œil à un autre article : Découvrir la Puissance d'Async/Await en JavaScript où vous approfondirez vos connaissances en programmation asynchrone.
C'est parti ! 🦅
📚 Vous Voulez Approfondir Vos Connaissances en JavaScript ?
Cet article a couvert les nouvelles fonctionnalités d'ECMAScript 2025, mais il y a beaucoup plus à explorer dans le monde du JavaScript moderne.
Les développeurs qui investissent dans un savoir solide et structuré ont tendance à avoir plus d'opportunités sur le marché.
Matériel d'Étude Complet
Si vous voulez maîtriser JavaScript du basique à l'avancé, j'ai préparé un guide complet :
Options d'investissement :
- 1x de 9,90€ par carte
- ou 9,90€ comptant
👉 Découvrir le Guide JavaScript
💡 Matériel mis à jour avec les meilleures pratiques du marché