Module

En cas de conflit de noms importés, on peut aussi créer un espace de nom pour notre module.

Méthodejs/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éthodejs/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: ƒ ()