🚀 Nuova versione beta disponibile! Feedback o problemi? Contattaci

Async e Await in Javascript

Codegrind Team•Jul 22 2023

Introduzione ad Async/Await

Async/Await è un approccio moderno per gestire operazioni asincrone in JavaScript, introdotto con ES2017 (ES8). Questa sintassi semplifica la scrittura di codice asincrono in modo chiaro e leggibile, eliminando la necessità di annidare callback o utilizzare catene di promesse. Async/Await si basa sulle promesse, che forniscono una base solida per la gestione delle operazioni asincrone.

Utilizzo di Async/Await

Async/Await si basa su due parole chiave: async e await. Una funzione dichiarata con la parola chiave async è considerata asincrona e può contenere l’operatore await, che sospende l’esecuzione della funzione fino a quando la promessa viene risolta o respinta.

Esempio di Utilizzo di Async/Await

Ecco un esempio di come utilizzare Async/Await per gestire un’operazione asincrona, inclusa una richiesta fetch:

async function ottieniDati(url) {
  try {
    const risposta = await fetch(url);
    const dati = await risposta.json();
    return dati;
  } catch (errore) {
    console.error(errore);
    throw errore;
  }
}

async function principale() {
  const urlApi = "https://jsonplaceholder.typicode.com/posts/1";
  try {
    const risultato = await ottieniDati(urlApi);
    console.log(risultato);
  } catch (errore) {
    console.error("Si è verificato un errore:", errore);
  }
}

principale();

In questo esempio, la funzione ottieniDati() utilizza la parola chiave await per sospendere l’esecuzione fino a quando la richiesta fetch e il parsing JSON non sono completati. La funzione principale() dimostra come utilizzare async/await con una richiesta fetch per gestire i dati della risposta.

Gestione degli Errori con Async/Await

Async/Await semplifica anche la gestione degli errori. Utilizzando il blocco try/catch, è possibile catturare gli errori generati sia dalla promessa che da eventuali errori generati all’interno della funzione asincrona.

Utilizzo di Async/Await in Cicli

Async/Await può essere utilizzato in modo efficace nei cicli asincroni. Ad esempio, se è necessario eseguire una serie di operazioni asincrone in sequenza, Async/Await semplifica il codice:

async function eseguiOperazioniInSequenza(operazioni) {
  for (const operazione of operazioni) {
    const risultato = await eseguiOperazioneAsincrona(operazione);
    console.log(risultato);
  }
}

In questo esempio, la funzione eseguiOperazioniInSequenza() itera su un array di operazioni e utilizza l’operatore await per eseguire ciascuna operazione in sequenza.

Conclusione

Async/Await rappresenta un miglioramento significativo nella gestione delle operazioni asincrone in JavaScript. Questo approccio moderno semplifica la scrittura di codice asincrono, migliorando la leggibilità e l’affidabilità. Async/Await è particolarmente utile per semplificare flussi di lavoro complessi e operazioni sequenziali. Nelle prossime lezioni, esploreremo ulteriori dettagli sull’utilizzo di Async/Await, inclusa la gestione delle eccezioni e i pattern avanzati.