JavaScript 里的 Async Await

142 阅读2分钟

image.png

Sync:同步

公园里有一台新的咖啡自动售货机。 最初只有 10-20 人在用。

image.png

售货机一次只能服务一个人,其他人需要排队等待。

这就是同步执行。 和编译器一次执行一条语句类似,下一条语句需要等到前一次执行完毕。

问题:

刚开始的时候一切都还好。但是你开始注意到很多人开始使用这台机器。现在每天都排很长的队……

Async: 异步

看到这个机会,另一个家伙在自动售货机的后面开了一家咖啡店。 现在有一半人不再排队而是开始去他的商店。

image.png

这个比喻类似于异步进程(并行进程),当主资源阻塞进程时,你不想等待,于是你开始共享其他可用资源,

场景:

你可能见到过,当你上传某些内容时,旧的政府网站会重新加载整个页面,并且这个页面会一直加载直到上传完成。在上传完成前,你不能做任何其他事情。

这种同步处理会阻塞应用的主线程,这种体验是非常糟糕的。

不必要地阻止后续执行的情况,我们称之为阻塞。 这就是为什么我们需要异步运行文件上传过程以便用户可以继续浏览并且上传继续运行在后台。

这里有几个例子:

自动化、数据处理、电子邮件、API 响应、耗时计算等所有这些都应该异步运行在第二个线程上。

等等,什么是线程 ??

简单来说,线程只是一组要执行的控制语句(命令)。

Await :

await 允许你有选择地等待 async 函数完成,你只能在 async 函数内部使用 await,下面是 Javascript 实现。 [并非所有语言都支持 await 关键字]

image.png AWAIT

有何缺点 ??

当然,CPU 使用率会增加,如果不注意,在某些情况下,还会导致内存泄漏。