问题描述
在使用 ES7 的 async/await 语法时，我们可能会遇到一些奇怪的问题。比如在使用 await 关键字时，程序卡住不动，没有任何输出。这种情况很可能是因为我们在 async 函数中使用了 return 语句。
----- -------- ----------- - ----- ------ - ----- ------------------- ------ -------------- - ----- ---- - ------------ ------------------
上面的代码看起来没有任何问题，但是当我们运行它时，却发现没有输出任何东西。这是因为我们在 fetchData 函数中使用了 return 语句，而 async/await 语法会自动将函数的返回值包装成一个 Promise 对象。因此，我们的代码实际上是这样的：
----- ---- - ----------------------------- ------------------
这样做显然是不对的，因为我们想要的是等待 fetchData 函数执行完毕后再输出结果。但是由于 Promise.resolve 是立即执行的，所以我们得到的结果是 fetchData 函数的返回值，而不是它执行完毕后的结果。
解决方案
要解决这个问题，我们需要将 return 语句改为 await 语句：
----- -------- ----------- - ----- ------ - ----- ------------------- ----- ------------------ -- ------ ----------------- ----- --- ------ -------------- - ----- ---- - ------------ ------------------
这样做的原理是，await 语句会等待 Promise 对象的状态变为 resolved 后再继续执行，而 Promise.resolve() 会立即返回一个 resolved 的 Promise 对象。因此，我们在 fetchData 函数中加上一个 Promise.resolve() 可以让代码按照我们的预期执行。
除了这个 Bug，我们还可能会遇到其他一些问题，比如在使用 try/catch 语句时无法捕获异常，或者在使用 Promise.all 时出现错误。这些问题的解决方案也比较简单，只需要仔细阅读文档并熟悉 async/await 语法的使用规则即可。
总结
ES7 的 async/await 语法是一种非常方便的异步编程方式，但是在使用时需要注意一些细节，避免出现一些奇怪的 Bug。如果遇到问题，可以仔细阅读文档并进行调试，相信一定能够找到解决方案。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/660ba152d10417a222bca1f5