await fetch 本地_JavaScript async/await 正确合理使用

ES8 引入的 async/await 在 JavaScript 的异步编程中是一个极好的改进。它提供了使用同步样式代码异步访问 resoruces的方式，而不会阻塞主线程。然而，它们也存在一些坑及问题。在本文中，将从不同的角度探讨 async/await，并演示如何正确有效地使用这对兄弟。

前置知识

async 作用是什么

从 MDN 可以看出：

async 函数返回的是一个 Promise 对象。async 函数(包含函数语句、函数表达式、Lambda表达式)会返回一个 Promise 对象，如果在函数中 return 一个直接量，async 会把这个直接量通过 Promise.resolve() 封装成 Promise 对象。

如果 async 函数没有返回值， 它会返回 Promise.resolve(undefined)。

await 作用是什么

从 MDN 了解到：

await 等待的是一个表达式，这个表达式的计算结果是 Promise 对象或者其它值(换句话说，await 可以等任意表达式的结果)。

如果它等到的不是一个 Promise 对象，那 await 表达式的运算结果就是它等到的东西。

如果它等到的是一个 Promise 对象，await 就忙起来了，它会阻塞后面的代码，等着 Promise 对象 resolve，然后得到 resolve 的值，作为 await 表达式的运算结果。

这就是 await 必须用在 async 函数中的原因。async 函数调用不会造成阻塞，它内部所有的阻塞都被封装在一个 Promise 对象中异步执行。

async/await 的优点

async/await 带给我们的最重要的好处是同步编程风格。让我们看一个例子：

很明显&#