Nous travaillons avec la société Google et avec des technologies comme les cookies pour stocker et/ou accéder à des informations personnelles non sensibles stockées sur votre terminal (identifiants uniques, …), que nous traitons afin de réaliser des statistiques d'usage du site, personnaliser les publicités et le contenu et en mesurer les performances, produire des données d’audience, développer et améliorer les produits.
Acceptez-vous les cookies déposés pour la publicité et les mesures d'audience ?
Les imports/exports ne sont pas encore implémentés dans les navigateurs, il existe des modules loader ou des modules bundler pour travailler avec les modules. Dans tous les exemples suivants on utilise webpack pour faire fonctionner les imports/exports.
Il suffit de reprendre le tutorial d'installation de webpack sur ce site et de modifier les fichiers js2 et js1.
Export/import d’une variable
js1.js
var x = 44; export {x};
js2.js
import {x} from "./js1.js"; alert("x :" + x);
On peut aussi déclarer la variable let ou const. Var, let et const ne sont importants que dans le fichier qui exporte les variables.
Comme les variables importées sont en lecture seule on ne peut pas les modifier. Exemple : x = 66 est interdit.
Export/import d’une fonction
js1.js
function display(msg) { alert(msg); }; export {display};
js2.js
import {display} from './js1.js'; display("hellooo world");
Export/import d’un objet littéral
js1.js
var obj = { nom : "durant", age : 15 }; export {obj};
Si vous exportez un objet tous les modules qui vont l’importer auront les mêmes données c’est un singleton.
js2.js
import {obj} from "./js1.js"; alert("nom :" + obj.nom);
Export/import d’une classe
js1.js
function Personne(nom) { this.Nom = nom; this.Afficher = function() { document.write(this.Nom); } } export {Personne};
js2.js
import {Personne} from "./js1.js"; let unePersonne = new Personne("durant"); let uneAutrePersonne = new Personne("martin"); unePersonne.Afficher(); uneAutrePersonne.Afficher();
Export/import par défaut d’une fonction
On a le droit de définir un export par défaut dans un module. Les exports par défaut ne fonctionnent qu’avec les fonctions, les objets et les classes. Vous pouvez spécifier n’importe quel nom au moment de l’import.
js1.js
export default function(x) { return x * 2; }
On peut avoir d’autres déclarations d’export nommés dans le même module.
js2.js
import Multiplier from "./js1.js"; alert (Multiplier(5));
Plus besoin d’accolade pour les exports par défaut. Vous pouvez choisir le nom de l’import.
Export/import par défaut d’un objet littéral
Il faut supprimer l’exemple précédant.
js1.js
export default { nom : "clyde", age : 15 }
js2.js
import unObjet from "./js1.js"; alert (unObjet.nom);