Réécriture avec async/await
Réécrire cet exemple de code du chapitre Chaînage des promesses en utilisant async/await
au lieu 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
Les notes sont en dessous du code:
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)
Notes:
-
La fonction
loadJson
devientasync
. -
Tous les
.then
intérieurs sont remplacés parawait
… -
Nous pouvons
return response.json()
au lieu de l’attendre, comme ceci:if (response.status == 200) { return response.json(); // (3) }
Ensuite, le code externe devra “attendre” la résolution de cette promesse. Dans notre cas, cela n’a pas d’importance.
-
L’erreur émise par
loadJson
est gérée par.catch
. Nous ne pouvons pas utiliserawait loadJson(...)
ici, car nous ne sommes pas dans une fonctionasync
…