了解 JavaScript 中的 async 和 wait：简洁异步代码的关键

本篇文章主要是结合我之前面试的各种经历和实战开发中遇到的问题解决经验整理的，希望这篇《了解 JavaScript 中的 async 和 wait：简洁异步代码的关键》对你有很大帮助！欢迎收藏，分享给更多的需要的朋友学习~

JavaScript 的异步特性是其最大的优势之一，但它也可能成为开发人员沮丧的根源。随着时间的推移，我们已经从回调函数（以及可怕的“回调地狱”）转向承诺，现在转向异步和等待。这些现代工具简化了异步编程，使您的代码更具可读性、可维护性和高效性。

但是 async 和 wait 到底如何工作，为什么它们如此有用？让我们深入探索吧！

什么是异步和等待？
在 JavaScript 中，async 和 wait 是 ES2017 (ES8) 的一部分，提供了一种以更同步的方式处理异步操作的方法。它们构建在 Promise 之上，允许您编写更清晰、更易读的代码。

• async：将函数声明为异步可确保它始终返回一个 Promise，即使您没有显式返回一个

• await：此关键字在异步函数内使用，用于暂停函数的执行，直到承诺得到解决或拒绝。它使异步代码看起来是同步的。

它们如何工作？
让我们看一些示例来了解它们是如何工作的。

异步 函数示例

这里，async 关键字自动将返回值包装在 Promise 中。因此，调用 sayHello() 将返回一个解析为 “Hello, World!”

在 async 函数中使用 await
await 关键字暂停函数的执行，直到承诺得到解决或拒绝。

如果没有 await，您需要链接 .then() 调用，这会使代码更难阅读。

是否 等待 阻止执行？
如果 await 确实会阻塞执行，那么它与传统的同步 JavaScript 有何不同？使用它的实际好处是什么？

这里出现了一些混乱：await 不会阻塞主线程。它只会暂停当前异步函数的执行，而程序的其他部分继续运行。

类比：
想象一下你正在做饭：

• 同步：你必须站在炉子旁边不断地搅拌锅，直到食物煮熟。在那段时间你不能做任何其他事情。

• 异步/等待：你将食物放入烤箱（等待它会被煮熟的 Promise）。然后，您可以在等待时做其他事情（切蔬菜、摆桌子）。当计时器响起时（承诺解决），您回到烤箱并取出食物。

示例：

输出：

请注意，“End”记录在“Data fetched”之前。这表明，虽然 await 暂停 fetchData 函数，但它不会阻塞程序的其余部分。

结论
async 和 await 是强大的工具，可以改变我们在 JavaScript 中编写异步代码的方式。通过使异步工作流程看起来同步，它们提高了可读性，简化了错误处理，并为您提供了对顺序和并行操作的精确控制 - 所有这些都不会阻塞主线程。

今天关于《了解 JavaScript 中的 async 和 wait：简洁异步代码的关键》的内容介绍就到此结束，如果有什么疑问或者建议，可以在golang学习网公众号下多多回复交流；文中若有不正之处，也希望回复留言以告知！