Esercizi Promise Javascript
Ecco degli esercizi semplici con soluzione per praticare le basi delle promise o promesse in Javascript.
Esercizio 1
Creare una promise che si risolve dopo 2 secondi:
const promessa = new Promise(function (resolve, reject) { setTimeout(function () { resolve("Promessa risolta"); }, 2000);});
promessa.then(function (risultato) { console.log(risultato);});
Esercizio 2
Creare una promise che viene rifiutata dopo 3 secondi:
const promessa = new Promise(function (resolve, reject) { setTimeout(function () { reject("Promessa rifiutata"); }, 3000);});
promessa.catch(function (errore) { console.log(errore);});
Esercizio 3
Eseguire una serie di chiamate asincrone in sequenza utilizzando le promise:
function eseguiChiamata(numero) { return new Promise(function (resolve, reject) { setTimeout(function () { resolve(`Chiamata ${numero} completata`); }, 1000); });}
eseguiChiamata(1) .then(function (risposta) { console.log(risposta); return eseguiChiamata(2); }) .then(function (risposta) { console.log(risposta); return eseguiChiamata(3); }) .then(function (risposta) { console.log(risposta); }) .catch(function (errore) { console.log(errore); });
Esercizio 4
Gestire il caso in cui una promise venga risolta o rifiutata immediatamente:
const promessa = new Promise(function (resolve, reject) { if (Math.random() < 0.5) { resolve("Promessa risolta immediatamente"); } else { reject("Promessa rifiutata immediatamente"); }});
promessa .then(function (risultato) { console.log(risultato); }) .catch(function (errore) { console.log(errore); });
Esercizio 5
Utilizzare Promise.all per eseguire più promise contemporaneamente:
const promessa1 = eseguiChiamata(1);const promessa2 = eseguiChiamata(2);const promessa3 = eseguiChiamata(3);
Promise.all([promessa1, promessa2, promessa3]) .then(function (risultati) { console.log(risultati); }) .catch(function (errore) { console.log(errore); });
Esercizio 6
Utilizzare Promise.race per ottenere il risultato della promise più veloce:
const promessa1 = new Promise(function (resolve, reject) { setTimeout(function () { resolve("Promessa 1 risolta"); }, 2000);});
const promessa2 = new Promise(function (resolve, reject) { setTimeout(function () { resolve("Promessa 2 risolta"); }, 1000);});
Promise.race([promessa1, promessa2]) .then(function (risultato) { console.log(risultato); }) .catch(function (errore) { console.log(errore); });
Esercizio 7
Utilizzare le promise per caricare dati da una risorsa esterna:
function caricaDati() { return new Promise(function (resolve, reject) { fetch("https://api.example.com/dati") .then(function (response) { if (response.ok) { resolve(response.json()); } else { reject("Errore nel caricamento dei dati"); } }) .catch(function (error) { reject(error); }); });}
caricaDati() .then(function (dati) { console.log(dati); }) .catch(function (errore) { console.log(errore); });
Esercizio 8
Utilizzare le promise per effettuare una chiamata AJAX:
function effettuaChiamataAJAX(url, metodo) { return new Promise(function (resolve, reject) { const xhr = new XMLHttpRequest();
xhr.open(metodo, url);
xhr.onload = function () { if (xhr.status >= 200 && xhr.status < 300) { resolve(xhr.responseText); } else { reject("Errore nella chiamata AJAX"); } };
xhr.onerror = function () { reject("Errore nella chiamata AJAX"); };
xhr.send(); });}
effettuaChiamataAJAX("https://api.example.com/dati", "GET") .then(function (response) { console.log(response); }) .catch(function (errore) { console.log(errore); });
Esercizio 9
Utilizzare le promise per eseguire operazioni asincrone in sequenza:
function operazione1() { return new Promise(function (resolve, reject) { setTimeout(function () { resolve("Operazione 1 completata"); }, 1000); });}
function operazione2() { return new Promise(function (resolve, reject) { setTimeout(function () { resolve("Operazione 2 completata"); }, 2000); });}
operazione1() .then(function (risultato1) { console.log(risultato1); return operazione2(); }) .then(function (risultato2) { console.log(risultato2); }) .catch(function (errore) { console.log(errore); });