Merge pull request #328 from pasor1/sync

Sync

Author: pasor1

1-js/03-code-quality/06-polyfills/article.md

@@ -22,7 +22,7 @@ In questo capitolo cercheremo di capire il loro funzionamento ed il loro ruolo n
 
 ## Transpilers
 
-Un [transpiler](https://en.wikipedia.org/wiki/Source-to-source_compiler) è un particolare software capace di analizzare il codice moderno e di riscriverlo utilizzando sintassi e costrutti meno recenti, facendo in modo che il funzionamento sia simile.
+Un [transpiler](https://en.wikipedia.org/wiki/Source-to-source_compiler) è un particolare software che traduce il codice sorgente da un formato ad un altro. Può analizzare il codice moderno e riscriverlo utilizzando sintassi e costrutti meno recenti, rendendolo compatibile con i motori JavaScript meno recenti.
 
 Es. JavaScript prima del 2020 non aveva "l'operatore di coalescenza nullo" `??`. Quindi, se un visitatore utilizza un vecchio browser, questo non potrebbe comprendere `height = height ?? 100`.
 

1-js/04-object-basics/09-object-toprimitive/article.md

@@ -267,4 +267,4 @@ L'algoritmo di conversione segue questi passi:
 
 Nella pratica, spesso è sufficiente implementare solo `obj.toString()` come metodo che "cattura tutte" le conversioni e ritorna una rappresentazione dell'oggetto "interpretabile dall'uomo", per mostrarlo o per il debugging.
 
-Per quanto riguarda le operazioni matematiche, JavaScript non fornisce un modo per "sovrascriverle" utilizzando i metodi, quindi vengono raramente utilizzate in progetti reali.
+Per quanto riguarda le operazioni matematiche, JavaScript non fornisce un modo per "sovrascriverle" utilizzando i metodi, quindi vengono raramente utilizzate sugli oggetti.

1-js/05-data-types/02-number/article.md

@@ -60,10 +60,10 @@ In altre parole, un numero negativo dopo `"e"` significa una divisione per 1 seg
 
 ```js
 // -3 divide 1 con 3 zeri
-1e-3 = 1 / 1000 (=0.001)
+1e-3 = 1 / 1000; // 0.001
 
 // -6 divide 1 con 6 zeri
-1.23e-6 = 1.23 / 1000000 (=0.00000123)
+1.23e-6 = 1.23 / 1000000; // 0.00000123
 ```
 
 ### Numeri esadecimali, binari e ottali
@@ -440,7 +440,7 @@ Per diversi sistemi numerici:
 
 Per convertire a numeri valori del tipo `12pt` e `100px`:
 
-- Utilizzate parseInt/parseFloat per un conversione "soft", i quali provano a leggere un numero da una stringa e ritornano ciò che sono riusciuti ad estrarre prima di interrompersi.
+- Utilizzate parseInt/parseFloat per un conversione "soft", i quali provano a leggere un numero da una stringa e ritornano ciò che sono riusciti ad estrarre prima di interrompersi.
 
 Per i numeri con la virgola:
 

1-js/09-classes/04-private-protected-properties-methods/article.md

@@ -116,7 +116,7 @@ class CoffeeMachine {
 let coffeeMachine = new CoffeeMachine(100);
 
 // aggiungiamo acqua
-coffeeMachine.waterAmount = -10; // Errore: valore dell'acqua negativo 
+coffeeMachine.waterAmount = -10; // _waterAmount diventerà 0, non -10
 ```
 
 Ora l'accesso è sotto controllo, quindi non è più possibile impostare la quantità d'acqua ad un valore negativo.

1-js/11-async/01-callbacks/article.md

@@ -2,12 +2,12 @@
 
 # Introduzione: callbacks
 
-```warn header="Utilizeremo i metodi browser in questi esempi"
-Per dimostrare l'utilizzo di callbacks, promise ed altri concetti astratti, utilizzeremo alcuni metodi del browser: nello specifico, caricamento di script e sempliici manipolazioni del documento.
+```warn header="Utilizzeremo i metodi browser in questi esempi"
+Per dimostrare l'utilizzo di callbacks, promise ed altri concetti astratti, utilizzeremo alcuni metodi del browser: nello specifico, caricamento di script e semplici manipolazioni del documento.
 
 Se questi metodi non vi sono familiari, e il loro utilizzo negli esempi vi risulta di difficile comprensione, potreste voler leggere un paio di capitolo della [prossima parte](/document) del tutorial.
 
-Anche se, povreremo a mantenere le spiegazioni più chiare possibili. Non ci sarà nulla di realmente complesso dal punto di vista del browser.
+Anche se, proveremo a mantenere le spiegazioni più chiare possibili. Non ci sarà nulla di realmente complesso dal punto di vista del browser.
 ```
 
 Molte funzioni vengono fornite da ambienti JavaScript che permettono di schedulare azioni *asincrone*. In altre parole, azioni che iniziano ora, ma finiranno in un secondo momento.
@@ -28,7 +28,7 @@ function loadScript(src) {
 }
 ```
 
-Lo scopo della funzione è quello di caricare un nuovo script. Quando aggiunge il tag `<script src="…">` al documento, il browser lo caricherà ed eseguirà.
+La funzione inserisce nel documento il nuovo script creato dinamicamente `<script src="…">` con il dato `src`. Il browser eseguità automaticamente il caricamento ed una volta terminato eseguirà lo script.
 
 Possiamo usare la funzione in questo modo:
 
@@ -37,7 +37,7 @@ Possiamo usare la funzione in questo modo:
 loadScript('/my/script.js');
 ```
 
-La funzione è chiamata "asincronamente", perché l'azione (il caricamento dello script) non finirà adesso ma in seguito.
+La funzione è chiamata in modo asincrono, perché l'azione (il caricamento dello script) non finirà adesso ma in seguito.
 
 Se c'è del codice sotto `loadScript(…)`, non dovrà attender fino al caricamento dello script.
 
@@ -103,12 +103,12 @@ function loadScript(src, callback) {
 *!*
 loadScript('https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.2.0/lodash.js', script => {
   alert(`Cool, the ${script.src} is loaded`);
-  alert( _ ); // funzione dichiatata nello script caricato
+  alert( _ ); // funzione dichiarata nello script caricato
 });
 */!*
 ```
 
-Questo è lo stile di programmazione asincrona "callback-based". Una funzione che fa qualcosa asincronamente dovrebbe prevedere un argomento `callback` in cui mettiamo la funzione da eseguire al completamento dell'operazione asincrona.
+Questo è lo stile di programmazione asincrona "callback-based". Una funzione che fa qualcosa in modo asincrono dovrebbe prevedere un argomento `callback` in cui mettiamo la funzione da eseguire al completamento dell'operazione asincrona.
 
 In questo esempio lo abbiamo fatto in `loadScript` ma, ovviamente, è un approccio generale.
 

1-js/11-async/05-promise-api/article.md

@@ -18,7 +18,7 @@ let promise = Promise.all([...promises...]);
 
 `Promise.all` accetta un array di promise (tecnicamente si può usare qualsiasi iterabile, ma solitamente si usa un array) e ritorna una nuova promise.
 
-La nuova promise risolve (resolves) quando tutte le promise elencate sono ferme (settled) ed ha un array dei loro risultati (?).
+La nuova promise si risolve quando tutte le promise elencate vengono risolte, e l'array dei loro risultati diventa il risultato finale.
 
 Per esempio, il `Promise.all` sotto si ferma (settles) dopo 3 secondi, ed il suo risultato è un array `[1, 2, 3]`:
 

2-ui/3-event-details/7-keyboard-events/article.md

@@ -139,30 +139,39 @@ Ora un esempio: il seguente campo `<input>` si aspetta un numero di telefono, qu
 ```html autorun height=60 run
 <script>
 function checkPhoneKey(key) {
-  return (key >= '0' && key <= '9') || key == '+' || key == '(' || key == ')' || key == '-';
+  return (key >= '0' && key <= '9') || ['+','(',')','-'].includes(key);
 }
 </script>
 <input *!*onkeydown="return checkPhoneKey(event.key)"*/!* placeholder="Inserire un numero di telefono" type="tel">
 ```
 
+Qui il gestore `onkeydown` utilizza `checkPhoneKey` per controllare i testi premuti. Se sono validi (da `0..9` o uno tra `+-()`), allora ritorna `true`, altrimenti `false`.
+
+Come sappiamo, il valore `false` restituito da un gestore di evento, assegnato usando un attributo o una proprietà DOM, come in questo caso, previene l'azione default, quindi non appare nulla in `<input>` per i tasti che non passano il tets. (Il valore `true` restituito non influenza nulla, conta solo la restituzione di `false`)
+
 È interessante notare che i tasti speciali, come `key:Backspace`, `key:Left`, `key:Right`, `key:Ctrl+V`, non funzionano nel campo input. Questo è un effetto collaterale delle restrizioni del filtro `checkPhoneKey`.
 
-Facciamolo "rilassare" un attimo:
+Rendiamolo un po' più rilassato permettendo i tasti freccia `key:Left`, `key:Right` e `key:Delete`, `key:Backspace`::
 
+Please note that special keys, such as `key:Backspace`, `key:Left`, `key:Right`, do not work in the input. That's a side-effect of the strict filter `checkPhoneKey`. These keys make it return `false`.
+
+Let's relax the filter a little bit by allowing arrow keys `key:Left`, `key:Right` and `key:Delete`, `key:Backspace`:
 
 ```html autorun height=60 run
 <script>
 function checkPhoneKey(key) {
-  return (key >= '0' && key <= '9') || key == '+' || key == '(' || key == ')' || key == '-' ||
-    key == 'ArrowLeft' || key == 'ArrowRight' || key == 'Delete' || key == 'Backspace';
+  return (key >= '0' && key <= '9') ||
+    ['+','(',')','-',*!*'ArrowLeft','ArrowRight','Delete','Backspace'*/!*].includes(key);
 }
 </script>
 <input onkeydown="return checkPhoneKey(event.key)" placeholder="Phone, please" type="tel">
 ```
 
 Adesso le frecce e il tasto cancella funzionano.
 
-...Tuttavia, siamo ancora in grado di inserire qualunque valore, usando il mouse, attraverso la funzionalità tasto destro + Incolla. Quindi il filtro non è al 100% affidabile. Volendo, possiamo lasciarlo così, dato che funzionerà la maggior parte delle volte. Un approccio alternativo, invece, potrebbe essere quello di tenere traccia dell'evento `input`, che scaturisce dopo ogni modifica al campo di testo. In questo modo possiamo sempre verificare il nuovo valore ed evidenziarlo/modificarlo se non ritenuto valido.
+Anche se abbiamo il filtro chiave, è comunque possibile inserire qualsiasi cosa utilizzando il mouse e facendo clic con il pulsante destro del mouse + Incolla. I dispositivi mobili forniscono altri mezzi per immettere valori. Quindi il filtro non è affidabile al 100%.
+
+L'approccio alternativo sarebbe quello di tenere traccia dell'evento `oninput`, che si attiva *dopo* qualsiasi modifica. Lì possiamo controllare il nuovo `input.value` e modificarlo/evidenziare `<input>` quando non è valido. Oppure possiamo usare entrambi i gestori di evento insieme.
 
 ## Eredità
 

6-data-storage/01-cookie/article.md

@@ -44,9 +44,7 @@ Lasciamo il compito in questione al lettore come esercizio. Inoltre, alla fine d
 
 ## Scrivere nel document.cookie
 
-Possiamo scrivere nel `document.cookie`. Ma fate attenzione che questa non è una proprietà, ma piuttosto un metodo di accesso (getter/setter) per leggere e scrivere.
-Un assegnazione a quest'ultimo è trattato in modo particolare.
-
+Possiamo scrivere nel `document.cookie`. Ma fate attenzione che questa non è una proprietà, ma piuttosto un metodo di accesso [accessor (getter/setter)](info:property-accessors). Un assegnazione a quest'ultimo è trattato in modo particolare.
 
 **Un'operazione di scritture nel `document.cookie` aggiorna solo i cookies menzionati all interno del documento stesso, ma non affligge altri cookies.**
 

6-data-storage/01-cookie/cookie.js

@@ -1,6 +1,6 @@
 function getCookie(name) {
   let matches = document.cookie.match(new RegExp(
-    "(?:^|; )" + name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, '\\$1') + "=([^;]*)"
+    "(?:^|; )" + name.replace(/([.$?*|{}()[\]\\/+^])/g, '\\$1') + "=([^;]*)"
   ));
   return matches ? decodeURIComponent(matches[1]) : undefined;
 }