Rescribir usando async/await
Rescribir este código de ejemplo del capítulo Encadenamiento de promesas usando async/await
en vez de .then/catch
:
function loadJson(url) {
return fetch(url)
.then(response => {
if (response.status == 200) {
return response.json();
} else {
throw new Error(response.status);
}
});
}
loadJson('https://javascript.info/no-such-user.json')
.catch(alert); // Error: 404
Las notas están bajo el código:
async function loadJson(url) { // (1)
let response = await fetch(url); // (2)
if (response.status == 200) {
let json = await response.json(); // (3)
return json;
}
throw new Error(response.status);
}
loadJson('https://javascript.info/no-such-user.json')
.catch(alert); // Error: 404 (4)
Notas:
-
La función
loadJson
se vuelveasync
. -
Todo lo que está dentro de
.then
es reemplazado porawait
. -
Podemos devolver
return response.json()
en lugar de esperar por él, como esto:if (response.status == 200) { return response.json(); // (3) }
Entonces el código externo tendría que esperar que la promesa se resuelva. En nuestro caso eso no importa.
-
El error arrojado por
loadJson
es manejado por.catch
. No podemos usarawait loadJson(…)
allí, porque no estamos en una funciónasync
.