前端 js/浏览器/node /js 引擎的事件循环机制,宏任务、微任务

首先我们知道js是单线程的,所以有了事件循环机制来处理异步任务,

我们一般说的事件循环机制指 js  引擎的事件循环机制,js是一个编程语言,哪来的事件循环,前端常见的 js 引擎有浏览器和node。

所以在面试中问道【你知道事件循环机制的逻辑吗?】一般就是说的浏览器的事件循环机制,但是浏览器是一个很复杂的系统,浏览器本身有很多进程要处理很多事情。所以,我们在面试中提到的事件循环是指,浏览器内部的 js 引擎对于 js 代码执行时的事件循环,对于 chrome 浏览器就是 v8 引擎。

浏览器环境的事件循环机制则更广泛,包括了JavaScript引擎的事件循环,同时还处理浏览器的其他任务,比如DOM事件、渲染等。这两者共同协作,使得浏览器能够以用户友好的方式响应交互、处理异步操作,并渲染页面。

所以,当我们说"事件循环机制"时,通常是在讨论JavaScript引擎内部的机制,但在浏览器环境中,它还涉及到其他方面的任务和事件。

同理还有 node 环境中  js 引擎的事件循环机制。

JavaScript引擎的事件循环机制包括调用栈、任务队列、微任务队列等概念,用于协调和执行异步任务。它确保JavaScript代码的执行是单线程的,同时能够处理异步任务,如定时器、事件处理、Promise回调等。

不论哪种环境,我们需要熟悉掌握的就是 js 引擎的事件循环机制。

JavaScript 引擎事件循环机制基本概念:

  1. 调用栈(Call Stack): 保存执行上下文的栈结构。当函数被调用时,会将其执行上下文推入调用栈,当函数执行完成时,将其从调用栈中弹出。

  2. 任务队列(Task Queue): 异步任务的回调函数会被放入任务队列。任务队列中的任务在调用栈为空时,会被移到调用栈执行。

  3. 微任务队列(Microtask Queue): 用于存放微任务(例如Promise回调、process.nextTick【node】、MutationObserver等),微任务会在当前宏任务执行结束后立即执行。

  4. 事件循环(Event Loop): 负责协调调用栈、任务队列和微任务队列的执行顺序。

JavaScript 引擎事件循环机制顺序

  1. 执行同步代码: 从顶部执行调用栈中的同步代码,直到调用栈为空。

  2. 检查微任务队列: 执行微任务队列中的所有任务。微任务包括Promise回调、process.nextTick、MutationObserver等。

  3. 检查宏任务队列: 选择宏任务队列中的一个任务,将其回调函数推入调用栈执行。宏任务包括定时器回调、事件处理函数等。

JavaScript的事件循环遵循一个"执行栈 - 微任务队列 - 宏任务队列"的执行顺序。

相关推荐

  1. js事件循环机制任务任务

    2024-01-08 07:18:03       31 阅读
  2. 任务任务区别

    2024-01-08 07:18:03       59 阅读
  3. 简述浏览器Node.js事件循环

    2024-01-08 07:18:03       34 阅读
  4. 任务任务

    2024-01-08 07:18:03       47 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-01-08 07:18:03       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-01-08 07:18:03       100 阅读
  3. 在Django里面运行非项目文件

    2024-01-08 07:18:03       82 阅读
  4. Python语言-面向对象

    2024-01-08 07:18:03       91 阅读

热门阅读

  1. 03 详细的Git命令使用大全

    2024-01-08 07:18:03       56 阅读
  2. 利用Podman构建基于Fission env/builder的镜像

    2024-01-08 07:18:03       89 阅读
  3. 【2023年度总结】蜕变与挑战

    2024-01-08 07:18:03       158 阅读
  4. vue3学习记录

    2024-01-08 07:18:03       54 阅读
  5. Django5+DRF序列化

    2024-01-08 07:18:03       48 阅读
  6. leetcode10-困于环中的机器人

    2024-01-08 07:18:03       60 阅读
  7. UNION 和 UNION ALL

    2024-01-08 07:18:03       55 阅读
  8. NodeJs 第六章 简单了解数据库(MySql)

    2024-01-08 07:18:03       62 阅读