Comment fonctionnent les modules dans ES Modules?

Les modules dans ES Modules fonctionnent en se basant sur une analyse statique des importations et exportations. Le navigateur ou l'environnement d'exécution analyse les fichiers JavaScript, détermine les dépendances entre les modules avant d'exécuter le code et crée un graphique de dépendances.

Principes de fonctionnement :

• Analyse statique : Les importations et exportations sont déterminées avant l'exécution du code, ce qui permet d'optimiser le chargement et de détecter les erreurs à un stade précoce.
• Liage univoque : Chaque importation est liée à une exportation spécifique dans un autre module.
• Instance unique : Le module s'exécute une seule fois lors de la première importation. Toutes les importations suivantes obtiennent une référence à la même instance.

Cycle de vie du module :

1. Construction : Le code source du module est analysé, les importations et exportations sont identifiées. Une enveloppe du module est créée.
2. Chargement : Tous les modules importés sont chargés. Si la dépendance n'est pas en cache, une requête est effectuée vers le réseau ou le système de fichiers.
3. Liage : Les importations et exportations sont liées. Les variables et fonctions des modules importés deviennent accessibles pour utilisation. Si l'importation ne peut pas être résolue, une erreur est levée.
4. Exécution : Le code du module est exécuté. Toutes les valeurs exportées deviennent accessibles pour les modules qui les importent.

Exemples :

// moduleA.js
export const name = 'Alice';
export function sayHello() {
  console.log(`Hello, ${name}!`);
}

// moduleB.js
import { name, sayHello } from './moduleA.js';

console.log(name); // Sortie : Alice
sayHello(); // Sortie : Hello, Alice!

Différences avec CommonJS :

Caractéristique	ES Modules	CommonJS
Liage	Statique	Dynamique
Chargement	Asynchrone (dans le navigateur)	Synchrone (par défaut)
Exportation	mot-clé export	module.exports
Importation	mot-clé import	Fonction require
Utilisation	Dans navigateur et Node.js (expérimental)	Dans Node.js