retour au cours
Ce contenu n'est disponible que dans les langues suivantes :عربي, English, Español, Italiano, 日本語, 한국어, Русский, Türkçe, 简体中文. Merci de

Rewrite this example code from the chapter Chaînage des promesses using async/await instead of .then/catch:

function loadJson(url) {
  return fetch(url)
    .then(response => {
      if (response.status == 200) {
        return response.json();
      } else {
        throw new Error(response.status);
      }
    });
}

loadJson('no-such-user.json')
  .catch(alert); // Error: 404

The notes are below the 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('no-such-user.json')
  .catch(alert); // Error: 404 (4)

Notes:

  1. The function loadJson becomes async.

  2. All .then inside are replaced with await.

  3. We can return response.json() instead of awaiting for it, like this:

    if (response.status == 200) {
      return response.json(); // (3)
    }

    Then the outer code would have to await for that promise to resolve. In our case it doesn’t matter.

  4. The error thrown from loadJson is handled by .catch. We can’t use await loadJson(…) there, because we’re not in an async function.