Gestione degli Errori nelle Promesse con .catch() e Async/Await

Introduzione

Le Promesse in JavaScript sono uno strumento potente per gestire operazioni asincrone. Tuttavia, la gestione degli errori può risultare complessa, specialmente quando si utilizzano funzioni asincrone. In questo tutorial, esploreremo come utilizzare .catch() in combinazione con async/await per gestire gli errori in modo efficace. Impareremo a scrivere codice più pulito e leggibile, riducendo la complessità della gestione degli errori.

Codice completo

const fetchData = async (url) => {
    try {
        const response = await fetch(url);
        
        // Verifica se la risposta è OK
        if (!response.ok) {
            throw new Error(´Network response was not ok ´ + response.statusText);
        }
        
        const data = await response.json();
        return data;
    } catch (error) {
        // Gestione degli errori
        console.error(´Si è verificato un errore:´, error);
        throw error; // Rilancia l´errore per la gestione successiva
    }
};

const displayData = async (url) => {
    try {
        const data = await fetchData(url);
        console.log(´Dati ricevuti:´, data);
    } catch (error) {
        console.error(´Impossibile visualizzare i dati:´, error.message);
    }
};

// Esempio di utilizzo
const url = ´https://api.example.com/data´;
displayData(url);

Spiegazione

Nel codice sopra, abbiamo definito due funzioni asincrone: fetchData e displayData.

fetchData(url): Questa funzione si occupa di recuperare dati da un´API. Utilizza fetch per effettuare una richiesta HTTP. Se la risposta non è OK (ad esempio, se il server restituisce un errore 404 o 500), lanciamo un errore personalizzato.
displayData(url): Questa funzione chiama fetchData e gestisce i dati ricevuti. Se si verifica un errore, viene catturato e stampato nel console log.

La chiave per gestire gli errori in questo esempio è l´uso del blocco try/catch. Se un errore si verifica all´interno del blocco try, il controllo passa immediatamente al blocco catch, dove possiamo gestire l´errore in modo appropriato.

Best practice

Utilizza try/catch con async/await: Questo approccio rende il codice più leggibile e semplifica la gestione degli errori rispetto all´uso di .then() e .catch().
Rilancia gli errori: Quando gestisci un errore, considera la possibilità di rilanciarlo. Questo ti permette di gestire errori a livelli superiori della tua applicazione, mantenendo la logica di gestione degli errori centralizzata.
Fornisci messaggi di errore chiari: Quando catturi un errore, assicurati di fornire un messaggio utile. Questo aiuta nel debugging e migliora l´esperienza dell´utente.
Valida le risposte delle API: Controlla sempre che la risposta dell´API sia valida e gestisci i casi in cui non lo sia. Questo ti aiuta a prevenire errori imprevisti nel tuo codice.

Riepilogo

In questo tutorial, abbiamo esplorato come gestire gli errori nelle Promesse utilizzando .catch() e async/await. Abbiamo visto come scrivere codice più leggibile e gestire gli errori in modo efficace. Ricorda che una buona gestione degli errori è fondamentale per creare applicazioni robuste e affidabili.

Approfondisci con risorse ufficiali

Add as preferred source on Google