Merge pull request #244 from longo-andrea/article/dynamic-imports

Dynamic imports

Author: longo-andrea

1-js/13-modules/03-modules-dynamic-imports/article.md

@@ -1,36 +1,36 @@
 # Dynamic imports
 
-Export and import statements that we covered in previous chapters are called "static". The syntax is very simple and strict.
+Le istruzioni di export ed import che abbiamo visto nei capitolo precedente sono detti "statici". La sintassi è molto semplice e rigorosa.
 
-First, we can't dynamically generate any parameters of `import`.
+Come prima cosa, non possiamo generare dinamicamente parametri di `import`.
 
-The module path must be a primitive string, can't be a function call. This won't work:
+Il percorso al modulo deve essere una stringa, non può essere una chiamata a funzione. Questo non funzionerebbe:
 
 ```js
-import ... from *!*getModuleName()*/!*; // Error, only from "string" is allowed
+import ... from *!*getModuleName()*/!*; // Errore, sono ammesse solamente string
 ```
 
-Second, we can't import conditionally or at run-time:
+Secondo, non possiamo importare a run-time in base a determinate condizioni:
 
 ```js
 if(...) {
-  import ...; // Error, not allowed!
+  import ...; // Errore, non è possibile farlo!
 }
 
 {
-  import ...; // Error, we can't put import in any block
+  import ...; // Errore, non possiamo scrivere gli import all'interno di nessun blocco
 }
 ```
 
-That's because `import`/`export` aim to provide a backbone for the code structure. That's a good thing, as code structure can be analyzed, modules can be gathered and bundled into one file by special tools, unused exports can be removed ("tree-shaken"). That's possible only because the structure of imports/exports is simple and fixed.
+Questo accade perché `import`/`export` mirano a fornire uno scheletro per la struttura del codice. Questa è una buona cosa, poiché la struttura del codice può essere analizzata, i moduli possono essere raccolti and impacchettati in un singolo file (grazie ad alcuni strumenti) e gli export inutilizzati possono essere rimossi ("tree-shaken"). Questo è possibile solamente perché la struttura degli imports/exports è semplice e preimpostata.
 
-But how can we import a module dynamically, on-demand?
+Ma come possiamo importare un modulo dinamicamente, a seconda delle necessità?
 
-## The import() expression
+## L'espressione import()
 
-The `import(module)` expression loads the module and returns a promise that resolves into a module object that contains all its exports. It can be called from any place in the code.
+L'espressione `import(module)` carica il modulo e ritorna una promise, che si risolve in un oggetto che contiene tutti gli export del modulo. Può essere quindi invocata in un qualsiasi punto del codice.
 
-We can use it dynamically in any place of the code, for instance:
+Possiamo utilizzarla dinamicamente ovunque, ad esempio:
 
 ```js
 let modulePath = prompt("Which module to load?");
@@ -40,9 +40,9 @@ import(modulePath)
   .catch(err => <loading error, e.g. if no such module>)
 ```
 
-Or, we could use `let module = await import(modulePath)` if inside an async function.
+oppure, potremmo utilizzare `let module = await import(modulePath)` se ci troviamo all'interno di una funzione asincrona.
 
-For instance, if we have the following module `say.js`:
+Ad esempio, se abbiamo il seguente modulo `say.js`:
 
 ```js
 // 📁 say.js
@@ -55,7 +55,7 @@ export function bye() {
 }
 ```
 
-...Then dynamic import can be like this:
+...Allora il dyamic import può essere scritto così:
 
 ```js
 let {hi, bye} = await import('./say.js');
@@ -64,7 +64,7 @@ hi();
 bye();
 ```
 
-Or, if `say.js` has the default export:
+Oppure, se `say.js` ha un default export:
 
 ```js
 // 📁 say.js
@@ -73,26 +73,26 @@ export default function() {
 }
 ```
 
-...Then, in order to access it, we can use `default` property of the module object:
+...Quindi, per potervi accedere, possiamo utilizzare la proprietà `default` dell'oggetto:
 
 ```js
 let obj = await import('./say.js');
 let say = obj.default;
-// or, in one line: let {default: say} = await import('./say.js');
+// o, in una riga: let {default: say} = await import('./say.js');
 
 say();
 ```
 
-Here's the full example:
+Qui vediamo l'esempio completo:
 
 [codetabs src="say" current="index.html"]
 
 ```smart
-Dynamic imports work in regular scripts, they don't require `script type="module"`.
+I dynamic import funzionano negli script regolari, non richiedono `script type="module"`.
 ```
 
 ```smart
-Although `import()` looks like a function call, it's a special syntax that just happens to use parentheses (similar to `super()`).
+Anche se `import()` sembra una chiamata a funzione, in realtà è una speciale sintassi che utilizza le parentesi (in modo simile a `super()`).
 
-So we can't copy `import` to a variable or use `call/apply` with it. It's not a function.
+Quindi non possiamo copiare `import` in una variabile o utilizzare `call/apply`. Non è una funzione.
 ```

1-js/13-modules/03-modules-dynamic-imports/say.view/index.html

@@ -4,7 +4,7 @@
     let say = await import('./say.js');
     say.hi(); // Hello!
     say.bye(); // Bye!
-    say.default(); // Module loaded (export default)!
+    say.default(); // Modulo caricato (export default)!
   }
 </script>
 <button onclick="load()">Click me</button>