在原生 JavaScript 中实现 async/await 语法

在原生 JavaScript 中实现 async/await 语法

这 **异步** / **等待** **** 语法是对 JavaScript 的强大补充——极大地改善了使用 Promise 时的整体开发体验。

但是，您可能会惊讶地听到这样的语法不需要直接的语言支持，而是可以使用现有的 JavaScript 功能实现。这是一个有趣的挑战，我们将在本文中尝试解决！ “我们如何才能让开发人员编写优雅的顺序异步代码，而不会插入所有混乱的 then-chaining？”

请注意，async/await 语法为开发人员提供了一种抽象，以便他们可以继续以自然的顺序流编写代码，就好像他们只是在编写标准函数一样。该功能将巧妙地暂停和恢复功能的概念执行，使用 Promise 系统实现。

我们必须考虑的问题是，是否存在任何其他 JavaScript 功能允许在概念上暂停和继续执行函数？实际上， 生成器函数 提供正是如此！那么，我们可以利用生成器语法来模拟行为类似于 async/await 语法的东西吗？确实，我们可以！

由于我们可以使用 **屈服** 关键字来暂停函数执行，我们可以编写一个装饰器函数来拦截这个过程并模拟异步执行流程。这令人惊讶地花了相当长的时间来弄清楚，但这是最终的解决方案，实际上非常简单：

要创建一个异步函数，我们通过上面运行一个生成器函数 **异步** **** 装饰师。我们通过产生一个 Promise 来暂停执行，然后我们的函数等待它。在 promise 解决或拒绝后，要么 **下一个** **** 或者 **扔** **** 迭代器协议的方法被调用以恢复执行，并且我们还传递了适当的值或错误。我们还允许生成基于非承诺的对象以简化开发人员体验。当生成器函数完成时，我们可以假设收到的最后一个值是返回值，因此我们可以简单地使用该值进行解析。蛋糕平安！ - 我希望。

让我们看看我们的解决方案在行动！

在这里，我们定义了两个异步函数， **垃圾邮件** **** 和 **主要的** , 在里面，我们简单地使用 **屈服** **** 等待任何承诺。我们可以很容易地将 promise 的结果赋值给一个变量。我们也可以继续使用正常的 JavaScript 异常处理流程。

这是该程序的输出：

**垃圾邮件 0  
 垃圾邮件 1  
 垃圾邮件 2  
 垃圾邮件 3  
 垃圾邮件 4  
 我们很高兴向您发送垃圾邮件  
 错误  
 5  
 展示结束**

惊人的！

对读者来说，一个很好的挑战是调整代码以实现异步生成器功能。在这种情况下，我们需要一个功能来重新引入原始 **屈服** 行为，同时也保持我们的等待功能——不知何故。

希望这是一本有趣且具有教育意义的读物。如果你喜欢，请随时给我一个掌声，以后你可以关注我更多这样的文章。感谢您的阅读！

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明

本文链接：https://www.qanswer.top/33268/40221309