使用 async/await 重写 - JavaScript 中文教程

使用async/await而不是.then/catch重写本章节Promises 链式调用中的示例代码

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

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

注释在代码下方

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.js.cn/no-such-user.json')
  .catch(alert); // Error: 404 (4)

注释

函数loadJson变为async。
所有.then内部都被替换为await。
我们可以return response.json()而不是等待它，像这样
```
if (response.status == 200) {
  return response.json(); // (3)
}
```
然后外部代码将不得不await该promise解析。在我们的例子中，这并不重要。
从loadJson抛出的错误由.catch处理。我们不能在那里使用await loadJson(…)，因为我们不在async函数中。