源码家族
当前位置:首页 > 资讯中心

资讯中心

【 对于JavaScript中事件循环和异步开发的概念你真的了解吗 】

发布时间:2021-05-31 09:59:25 阅读次数:109

当您只需要一个简单的工作界面时,就可以轻松使用JavaScript。 当界面变得更复杂时,问题就会随之而来。 这里需要你对JavaScript有更深入的了解。 更重要的是,即使是复杂的界面也能让程序快速响应。 通常使用异步函数处理响应。 这意味着你可以让你的代码同时做几件事。

javascript概念.jpg

什么是事件循环?


这是每个 JavaScript 开发人员都会以某种方式遇到的事情之一。 JavaScript 提供了一个基于事件循环的并发模型,它执行代码、收集和处理事件、执行子任务。


当程序启动时,它会运行这行代码。当遇到异步操作时,解释器将此操作抛出到调用堆栈上。在堆栈中,它看起来像某个设置超时和浏览器 API。然后弹出设置超时的窗口,并在Web API中注册一些匿名函数,5000秒后浏览器完成设置时执行。接下来,匿名函数进入回调队列。一个无限循环在队列中运行,它检查元素,如果它检测到函数已准备好,则将其扔回调用堆栈并执行它。


但是如果将 0 作为第二个参数传递给超时集会发生什么?


答案是:浏览器还是会把函数放到Web API中,程序会继续运行。


让我们来看看事件监听器是如何工作的。


事件侦听器,如上所述,也是一个异步事件,并转到 Web API。

js异步概念.jpg

需要注意的是:


引擎在执行任务期间永远不会弹出页面。 任务需要多长时间并不重要。 对 DOM 的更改仅在任务完成后出现。


如果任务耗时较长,浏览器无法执行其他任务或处理用户事件。 然后,一段时间后,浏览器会为您关闭长时间运行的任务。 当脚本包含大量复杂的计算或导致无限循环的错误时,这是很有可能的。

javascript概念.jpg

微任务


我们可以在最后一个例子中看到微任务。 当宏任务正在执行时,它的函数被放置在调用堆栈中。 在微任务完成之前,新的宏任务将不会开始执行。


最后,根据任务的具体情况,您可能会使用 async/await、回调或不同技术的某种组合。 其实,选择哪种异步开发方式这个问题的答案取决于项目的具体情况。 如果一种方法允许您使用易于维护且易于其他团队成员理解的可读代码来解决问题,那么这种方法就是您所需要的!

上一篇:关于 Web 前端,您需要了解什么? 需要掌握哪些技术
下一篇:入职第一天,程序员都需要注意什么?