10. I moduli ES6

I moduli ES6 consentono di creare applicazioni JavaScript strutturate in moduli indipendenti e riutilizzabili.

10.1. script [import-01, export-01]

Lo script [import-01] utilizzerà il modulo [export-01]. Quest’ultimo è definito come segue:


// esportazione predefinita di un oggetto senza nome
export default {
  data: 2,
  do() {
    console.log(this.data);
  }
};

Commenti

le righe [2-7] definiscono un oggetto senza nome con le proprietà [data, do];
riga 2: l’istruzione [export default] esporta questo oggetto. Esso potrà quindi essere importato;

Il modulo [export-01] viene utilizzato dallo script [import-01] nel modo seguente:


'use strict';
// importazione di un oggetto esportato per impostazione predefinita
import export01 from './export-01';
// utilizzo di questo oggetto
export01.do();
// è possibile importare un'esportazione predefinita con qualsiasi nome
import data from './export-01';
console.log(data.data);

Commenti

le righe 3 e 7 importano l’oggetto esportato per impostazione predefinita dal modulo [export-01] con due nomi diversi;
una volta importato un oggetto, è possibile utilizzarlo come se fosse stato definito localmente nello script;

Esecuzione


[Running] C:\myprograms\laragon-lite\bin\nodejs\node-v10\node.exe -r esm "c:\Data\st-2019\dev\es6\javascript\modules\import-01.js"
2
2

10.2. script [import-02, export-02]

Questi script mostrano l’esportazione di un oggetto denominato.

Lo script [export-02] è il seguente:


// esportazione predefinita di un oggetto denominato
const data = {
  data: 2,
  do() {
    console.log(this.data);
  }
};
// esportazione
export default data;

riga 9: si esporta l’oggetto [data];

Il fatto che l’oggetto esportato sia denominato o meno non influisce sull’operazione di importazione. Lo script [import-02] è il seguente:


'use strict';
// importazione di un oggetto esportato per impostazione predefinita
import module1 from './export-02';
// utilizzo di questo oggetto
module1.do();
// è possibile importare un'esportazione predefinita con qualsiasi nome
import module2 from './export-02';
console.log(module2.data);

Esecuzione


[Running] C:\myprograms\laragon-lite\bin\nodejs\node-v10\node.exe -r esm "c:\Data\st-2019\dev\es6\javascript\modules\import-02.js"
2
2

10.3. script [import-03, export-03]

Un modulo può esportare più elementi.

Lo script [export-03] è il seguente:


// esportazioni multiple
// esportazione oggetto
const data = {
  data: 2,
  do() {
    console.log(this.data);
  }
};
// funzione di esportazione
export { data };
function doSomething() {
  console.log("doSomething");
}
export { doSomething };

Commenti

righe 10 e 14: esportazione di due elementi. L'esportazione di un elemento avviene con la sintassi [export {élément}];

Lo script [import-03] utilizza il modulo [export-03] nel modo seguente:


'use strict';
// importazione di un modulo [export03]
import {data, doSomething} from './export-03';
// utilizzo delle importazioni
data.do();
doSomething();
// altra sintassi
import * as module from './export-03';
// uso dell'import
console.log(module.data);
module.doSomething();

riga 3: gli script [imports] vengono creati con i nomi esatti degli oggetti esportati;
riga 8: è possibile importare tutti gli oggetti esportati in un oggetto denominato (in questo caso [module]);

Esecuzione


[Running] C:\myprograms\laragon-lite\bin\nodejs\node-v10\node.exe -r esm "c:\Data\st-2019\dev\es6\javascript\modules\import-03.js"
2
doSomething
{ data: 2, do: [Function: do] }
doSomething