Module
En cas de conflit de noms importés, on peut aussi créer un espace de nom pour notre module.
Méthode : js/modules/compteur.js
1
let nb = 0;
2
let step = 1;
3
4
const setStep = (val) => {
5
step = val;
6
};
7
8
const increment = () => {
9
nb += step;
10
return nb;
11
};
12
13
const decrement = () => {
14
nb -= step;
15
return nb;
16
};
17
18
export { increment, decrement, nb, setStep };
Pas de changement
Méthode : js/app.js
1
import * as Cpt from "./modules/compteur.js";
2
3
const compteur = document.querySelector("#compteur");
4
5
Cpt.setStep(2);
6
7
compteur.textContent = Cpt.nb;
8
9
document
10
.querySelector("#increment")
11
.addEventListener("click", () => compteur.textContent = Cpt.increment());
12
13
document
14
.querySelector("#decrement")
15
.addEventListener("click", () => compteur.textContent = Cpt.decrement());
16
17
import * as Cpt : Cpt est un objet qui correspond à notre module. L'importateur choisi le nom de l'espace de nom.
Cpt.setStep(2) : pour accéder aux propriétés de notre module, nous utilisons l'écriture objet.
Ajoutez console.log(Cpt); à la fin de votre script, vous pouvez voir dans votre console que Cpt est bien considéré comme un Module.
1
Module
2
decrement: (...)
3
increment: (...)
4
nb: (...)
5
setStep: (...)
6
Symbol(Symbol.toStringTag): "Module"
7
get decrement: ƒ ()
8
set decrement: ƒ ()
9
get increment: ƒ ()
10
set increment: ƒ ()
11
get nb: ƒ ()
12
set nb: ƒ ()
13
get setStep: ƒ ()
14
set setStep: ƒ ()