美文网首页
JS的事件循环

JS的事件循环

作者: 南枫小谨 | 来源:发表于2021-04-14 21:58 被阅读0次

为什么有事件循环

-JS单线程
JavaScript设计之初就是单线程的,主要用途是与用户互动,以及操作DOM。为了避免两个线程同时操作DOM的情况发生,就采用了单线程。即使H5提出了web worker标准,它有很多限制,受主线程控制,是主线程的子线程。
-非阻塞
通过EventLoop实现

宏任务和微任务

宏任务和微任务
为什么要引入微任务,只有一种类型的任务不行么?

页面渲染事件,各种IO的完成事件等随时被添加到任务队列中,一直会保持先进先出的原则执行,我们不能准确地控制这些事件被添加到任务队列中的位置。但是这个时候突然有高优先级的任务需要尽快执行,那么一种类型的任务就不合适了,所以引入了微任务队列。

浏览器里的事件循环

关于微任务和宏任务在浏览器的执行顺序是这样的:

执行一只task(宏任务)
执行完micro-task队列 (微任务)
如此循环往复下去

常见的 task(宏任务) 比如:setTimeout、setInterval、script(整体代码)、 I/O 操作、UI 渲染等。
常见的 micro-task 比如: new Promise().then(回调)、MutationObserver(html5新特性) 等。

Node里的事件循环

大体的task(宏任务)执行顺序是这样的:

timers定时器:本阶段执行已经安排的 setTimeout() 和 setInterval() 的回调函数。
pending callbacks待定回调:执行延迟到下一个循环迭代的 I/O 回调。
idle, prepare:仅系统内部使用。
poll 轮询:检索新的 I/O 事件;执行与 I/O 相关的回调(几乎所有情况下,除了关闭的回调函数,它们由计时器和 setImmediate() 排定的之外),其余情况 node 将在此处阻塞。
check 检测:setImmediate() 回调函数在这里执行。
close callbacks 关闭的回调函数:一些准备关闭的回调函数,如:socket.on('close', ...)。

微任务和宏任务在Node的执行顺序

Node 10以前:
执行完一个阶段的所有任务
执行完nextTick队列里面的内容
然后执行完微任务队列的内容

Node 11以后:
和浏览器的行为统一了,都是每执行一个宏任务就执行完微任务队列。

相关文章

  • js事件循环

    js 是单线程的, js 的异步事件就是依赖于事件循环机制 事件循环 首先,我们来解释下事件循环是个什么东西: 就...

  • 2019-03-28

    JS 事件循环机制 - 任务队列、web API、JS主线程的相互协同 这篇文章的核心是分析js的事件循环,在此我...

  • Vue源码分析—响应式原理(四)

    nextTick JS 运行机制 JS 执行是单线程的,它是基于事件循环的。事件循环大致分为以下几个步骤: 所有同...

  • node 事件

    1、事件 1.1普通事件的使用 1.2、Node.js 的事件循环机制解析 1)Node 由事件循环开始,到事件循...

  • Js事件循环

    列表 JavaScript事件循环 测试金字塔 stub JavaScript事件循环理解 javaScript语...

  • js事件循环

    js是单线程的,那么是否代表参与js执行过程的线程只有一个? 答案:不是的,一共有4个线程参与该过程,但是永远只有...

  • js 事件循环

    先上代码 执行栈与事件队列 当javascript代码执行的时候会将不同的变量存于内存中的不同位置:堆(heap)...

  • js事件循环

    在js代码中,除了同步代码,就是异步代码,一个js文件是从上往下执行,遇到ajax,点击事件。settimeout...

  • JS事件循环

    深入理解javascript中的事件循环 (1)JS为何设计为单线程 js设计为单线程还是跟他的用途有关 试想一下...

  • JS事件循环

    之前在公众号发的一篇文章,在这里再发一次 先来看一道常见的面试题,请给出下面程序的打印顺序 单纯记住答案没有什么意...

网友评论

      本文标题:JS的事件循环

      本文链接:https://www.haomeiwen.com/subject/foollltx.html