Introduction

Un module est un fichier JavaScript dont le but est d'exporter des fonctions, des objets, des classes ou des valeurs primitives (entier, chaîne de caractères, booléen...).

Exemple :

  • index.php

  • js

    • importation.js

    • module

      • exportation.js

Fichier index.html :

1
<script type='module' src='js/importation.js'></script>

Le script est appelé avec le type module afin de signaler qu'il contiendra des importations.

Fichier importation.js :

1
import {nb} from './exportation.js';
2
console.log(nb);

L'url des fichiers importés est relative au fichier d'import. Elle doit commencer par ./ ou ../

Fichier exportation.js :

1
let nb = 0;
2
export {nb};

La variable nb est exportée.

Restrictions et compléments :

  • les variables exportées sont considérées comme des constantes dans le scope du fichier importateur. Vous ne pourrez pas redéfinir ni modifier la variable nb.

  • Pour des raisons de sécurité, vos navigateurs n'autorisent pas l'utilisation des modules dans des scripts locaux. Vous devez tester vos scripts via un serveur.

    Pour les développeurs PHP, testez vos fichiers comme pour vos fichiers PHP via WAMP, MAMP, XAMP ...

    Ou avec le serveur interne de PHP : php -S localhost :8000

    Pour les utilisateurs de VSCode vous pouvez utiliser l'extension Live Server qui vous permet d'ouvrir vos fichiers via un serveur local en appuyant sur Go Live.

  • Un fichier peut être importé plusieurs fois. Il ne sera interprété qu'une seule fois. Pour les développeurs PHP, c'est un peu comme un require_once.

  • Les modules sont écrits en mode strict. Le mode strict est une contrainte supplémentaire que l'on s'ajoute en javascript. Ce mode n'accepte pas "les petites erreurs" autorisées habituellement en javascript. Par exemple, le fait d'oublier de déclarer une variable, le javascript suppose que c'est un var. Le mode strict, lui, lève une erreur.