Moduli JavaScript
Moduli (Modules)
I moduli JavaScript ti permettono di decomporre il codice in file singoli.
Questo rende più facile la manutenzione della libreria di codice.
Il modulo è utilizzato import
dalla dichiarazione import da file esterni.
Il modulo dipende anche da type="module"
.
Esempio
<script type="module"> import message from "./message.js"; </script>
esportazione
confunzioneovariabileIl modulo può essere memorizzato in qualsiasi file esterno.
Ci sono due tipi di esportazione:Esportazione nominataeEsportazione predefinita.
Esportazione nominata (Named Exports)
Creiamo un file chiamato person.js e riempiamolo con il contenuto che vogliamo esportare.
Puoi creare esportazioni nominate in due modi. Uno è crearele in modo inline per ciascuna, l'altro è crearle tutte insieme alla fine del file.
Creazione inline per ciascuno:
person.js
export const name = "Bill"; export const age = 19;
Creazione in una volta sola alla fine del file:
person.js
const name = "Bill"; const age = 19; export {name, age};
Esportazione predefinita (Default Exports)
Creiamo un altro file chiamato message.js e mostriamo l'export default con esso.
In un file può esserci solo un default export.
Esempio
message.js
const message = () => { const name = "Bill"; const age = 19; return name + ' è ' + age + ' anni.'; }; export default message;
Importazione
Puoi importare moduli in un file in due modi, a seconda che siano named export o default export.
Il named export è costruito utilizzando parentesi graffe. Il default export no.
Importazione dal named export
Importazione da file person.js del named export:
import { name, age } from "./person.js";
Importazione dal default export
Importazione da file message.js del default export:
import message from "./message.js";
Attenzione
I moduli sono validi solo per il protocollo HTTP(s).
Le pagine aperte tramite il protocollo file:// non possono utilizzare importazione/esportazione.