Italiano Traduzione
Ciao, futuri programmatori! Sono entusiasta di essere il vostro guida in questo emozionante viaggio nel mondo di ECMAScript 2020. Come insegnante di scienze informatiche con anni di esperienza, ho visto innumerevoli studenti illuminarsi quando hanno compreso questi concetti. Allora, tuffiamoci e esploriamo le fantastiche funzionalità che ES2020 porta alla lingua JavaScript!
Funzionalità Aggiunte in ECMAScript 2020
ECMAScript 2020, conosciuto anche come ES2020, è come una scatola di attrezzi lucente per gli sviluppatori JavaScript. Introduce diverse funzionalità entusiasmanti che rendono la nostra vita di programmatori più facile ed efficiente. Scopriamo insieme questa scatola di attrezzi e vediamo cosa contiene!
Tipo di Dato BigInt
Immagina di contare le stelle nel cielo notturno. Ce ne sono miliardi! Nel passato, JavaScript aveva un limite su quanto grande potesse essere un numero. Ma ora, con BigInt, il cielo è il limite (è voluto il gioco di parole)!
BigInt ci permette di lavorare con numeri interi estremamente grandi. Ecco come puoi usarlo:
const bigNumber = 1234567890123456789012345678901234567890n;
console.log(bigNumber);
// Output: 1234567890123456789012345678901234567890n
const result = bigNumber + 1n;
console.log(result);
// Output: 1234567890123456789012345678901234567891n
In questo esempio, stiamo creando un BigInt aggiungendo 'n' alla fine del numero. La 'n' dice a JavaScript, "Ehi, questo è un BigInt!" Possiamo eseguire operazioni sui BigInt proprio come sui numeri regolari, ma ricorda di aggiungere 'n' a qualsiasi numero che stai usando con BigInt.
L'Operatore Nullish Coalescing (??)
Hai mai giocato al gioco "indovina il regalo"? Scuoti la scatola, e se non senti nulla, indovini che è vuota. L'operatore nullish coalescing è un po' come quello, ma per il codice!
Questo operatore ci aiuta a controllare se un valore è null o undefined, e se lo è, possiamo fornire un valore predefinito. Ecco come funziona:
let username = null;
console.log(username ?? "Ospite");
// Output: "Ospite"
username = "Alice";
console.log(username ?? "Ospite");
// Output: "Alice"
Nel primo caso, username è null, quindi l'operatore restituisce "Ospite". Nel secondo caso, username ha un valore, quindi restituisce quel valore. È come dire, "Se la scatola è vuota, supponiamo che contenga un orsetto!"
Il Metodo Promise.allSettled()
Immagina di essere un insegnante (come me!) in attesa che tutti i tuoi studenti finiscano un test. Alcuni potrebbero finire con successo, altri potrebbero arrendersi. Promise.allSettled() è come aspettare che tutti consegnino il loro foglio, indipendentemente da come sono andati.
Ecco un esempio:
const promise1 = Promise.resolve(3);
const promise2 = new Promise((resolve, reject) => setTimeout(reject, 100, 'foo'));
const promises = [promise1, promise2];
Promise.allSettled(promises).then((risultati) => risultati.forEach((risultato) => console.log(risultato.status)));
// Output:
// "fulfilled"
// "rejected"
In questo codice, abbiamo due promise. Una si risolve con successo, l'altra viene rifiutata. Promise.allSettled() aspetta che entrambe siano completate e poi ci dà lo stato di ciascuna.
Il Metodo String.matchAll()
Hai mai giocato a "Dove si nasconde Waldo?" Beh, matchAll() è come giocare a "Dove si nasconde Waldo?" con il testo! Ci aiuta a trovare tutte le occorrenze di uno schema in una stringa.
Vediamo come funziona:
const text = "Il gatto e il cappello sedettero sul tappeto.";
const regex = /at/g;
const matches = [...text.matchAll(regex)];
console.log(matches);
// Output: [
// ['at', index: 7, input: 'Il gatto e il cappello sedettero sul tappeto.', groups: undefined],
// ['at', index: 19, input: 'Il gatto e il cappello sedettero sul tappeto.', groups: undefined],
// ['at', index: 31, input: 'Il gatto e il cappello sedettero sul tappeto.', groups: undefined]
// ]
Qui, stiamo cercando tutte le occorrenze di "at" nel nostro testo. matchAll() restituisce un iteratore, che convertiamo in un array usando l'operatore di spargimento (...). Ogni corrispondenza ci dà informazioni su dove è stata trovata nella stringa.
L'Operatore di Chaining Opzionale (?.)
Ultimo ma non meno importante, parliamo dell'operatore di chaining opzionale. È come un esploratore cauto, che controlla ogni passo del percorso prima di procedere.
Ecco come funziona:
const user = {
name: "Alice",
address: {
street: "123 Main St"
}
};
console.log(user.address?.street);
// Output: "123 Main St"
console.log(user.phoneNumber?.home);
// Output: undefined
In questo esempio, stiamo cercando di accedere a proprietà che potrebbero non esistere. L'operatore ?. ci permette di farlo in sicurezza. Se user.address esiste, proverà ad accedere a street. Se user.phoneNumber non esiste, si ferma lì e restituisce undefined invece di generare un errore.
Tabella dei Metodi
Ecco una comoda tabella che riassume i nuovi metodi che abbiamo imparato:
Metodo | Descrizione |
---|---|
BigInt | Permette di lavorare con grandi interi |
?? (Nullish Coalescing) | Fornisce un valore predefinito per null o undefined |
Promise.allSettled() | Aspetta che tutte le promise siano risolte |
String.matchAll() | Trova tutte le occorrenze di uno schema in una stringa |
?. (Optional Chaining) | Accede in sicurezza alle proprietà annidate di un oggetto |
E voilà, gente! Abbiamo esplorato le emozionanti nuove funzionalità di ECMAScript 2020. Ricorda, il modo migliore per imparare è fare. Allora, avvia il tuo editor di codice e inizia a sperimentare con questi nuovi strumenti. Buon codice, e possa il tuo viaggio JavaScript essere pieno di entusiasmo e scoperte!
Credits: Image by storyset