当前位置： 移动技术网 > IT编程>开发语言>JavaScript > 小文的前端学习笔记---------事件循环机制（Event Loop）小结

小文的前端学习笔记---------事件循环机制（Event Loop）小结

2020年07月22日  | 移动技术网IT编程  | 我要评论
Js本身是单线程的，它的异步和多线程是通过事件循环机制来实现的
浏览器端的事件循环机制（Event Loop）
三部分：
  • 一个函数调用栈（stack）
    方法（函数）调用栈 JS stack 占用主线程的资源；调用时一个一个进栈，调用完成后再一个一个出栈。
  • 一个宏任务队列tasks
    宏任务队列，也叫消息（任务）队列 Message Queue； 事件循环机制不断去检查stack里是否为空，如果为空就把宏任务放到stack里（当且仅当stack为空时，才会执行宏任务里的代码）。
  • 一个微任务队列（Microtask Queue）
    在事件循环调度一个宏任务之前，查看微任务队列里面是否还有未执行的任务，要把微任务队列中的任务执行完，再执行下一个宏任务；Promise.then( ) async await创建的异步操作加入微任务队列中
第二轮事件循环：宏任务和微任务（两个宏任务之间存在微任务队列）

  • 宏任务（macrotask 也叫tasks）：
    setTimeout setInterval I/O操作（比如文件读取 网络请求） requestAnimationFrame UI渲染线程等都属于宏任务

  • 微任务（microtask 也叫jobs）：
    Promise.then( )（注：Promise构造函数里的代码是同步执行的）、Object.observe等属于微任务

  • Event loop会不断循环的去取tasks队列中最老的一个任务推入栈中执行，并在当次循环里依次执行并清空microtask队列里的任务。

了解：浏览器中的Event Loop跟node中的Event Loop是不一样的
  • Node在宏任务开始的阶段，将宏任务队列中的所有的任务都取出来执行（注意：浏览器的事件循环是先只取一个宏任务），每个宏任务阶段执行完毕后，开始执行微任务，再开始执行下一阶段的宏任务，以此构成事件循环。
  • Node的微任务中：nextTick比promise的优先级高
  • Node的宏任务：setTimeout和setImmediate执行顺序问题（取决于loop跟timer的大小关系）

本文地址：https://blog.csdn.net/wennianzhu/article/details/107481825

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网