async/await 的理解和用法

1. async 基本用法

用 async 声明的函数会隐式返回一个 Promise。

// 原始的函数
function fetchData1() {
  return "111";
}

// 将返回值改写为 Promise
function fetchData2() {
  return Promise.resolve("111");
}

// 相当于改写成这样
function fetchData2() {
  return new Promise((resolve，reject)=>{
  	resolve("111")
  });
}

// 改写后的函数可统一简写成（这就是async关键字）
async function fetchData2() {
  return "111";
}

可以看到 fetchData 函数加了async后，虽然代码上return的是"111"，但实际上它的返回值其实变成了 Promise对象。

不信你可以试着 console.log(fetchData2()) 一下。

接下来，我们将调用这个函数

function example() {
  const result = fetchData2(); // 返回的是 Promise，而不是实际数据
  console.log(result); // Promise 对象
}

可以发现返回是 Promise 对象，而非我 return 的 “111”。
那怎么样才能获取到"111"呢？这里就需要用到await了。

2. await 基本用法

async function example() {
  const result = await fetchData2(); // await关键字
  console.log(result); // 返回的是 "111"
}

这种写法比起不加async/await有什么好处呢？
它可以等到获取完 result 时，再来执行下面的 console.log(result)

相关文章：async/await 的理解和用法