JS事件循环机制
2021-12-06 00:07:08 2 举报
AI智能生成
登录查看完整内容
JS事件循环机制
作者其他创作
大纲/内容
指用户代理为了协调事件、用户交互、脚本、渲染、网络(这里说了5个点)等等必须使用的事件循环机制。
事件循环机制并不是 js 本身实现的,而是 js 的执行环境做的事情,比如浏览器或者 node 。
JS事件循环机制是什么
最早的设计初衷:运行在浏览器的脚本语言,实现页面交互。核心是 dom 操作,必须使用单线程,否则会出现复杂的线程同步问题。如果有多个线程一起工作,其中一个线程修改了某个 dom 元素,另一个线程同时删除了这个元素,此时浏览器将无法明确以哪个线程的结果为准。
采用单线程工作的原因
js 是单线程工作的
在主线程上排队执行的任务,只有前一个任务执行完毕,才能执行后一个任务。
同步任务
不进入主线程、而进入\"任务队列\"(task queue)的任务。
异步任务
为了解决耗时任务阻塞执行的问题有了异步模式
因为有了异步模式所以要有事件循环机制
JS为什么要有事件循环机制
JavaScript有一个基于事件循环的并发模型,事件循环负责执行代码、收集和处理事件以及执行队列中的子任务。
事件循环♻️所谓某个时刻就是同步任务执行完微任务回调函数也执行完成的时候。
js 运行时
完整事件循环执行顺序
什么时候会往消息队列添加消息
并发模型与事件循环
也叫做主线程
浏览器中事件循环相关的进程、线程
宏任务
微任务
浏览器中宏任务与微任务的本质区别
视图更新这里浏览器可能有自己的优化,合并多次事件循环的结果,做一次视图更新视图更新前会先执行 requestAnimationFrame 回调
微任务执行完成后浏览器会进行视图渲染
浏览器中的事件循环
等到用 node 多的时候再看吧,现在看就是死记硬背,记不住,记住点稍微问多点也不知道了
6个队列
根据这个图,微任务有两类执行时间点:1. 初始同步代码执行后2. 队列切换时node 里面也有 promise.then 这种微任务
完整事件循环
任务队列数
微任务执行时机
其实 process.nextTick 是一个很特殊的存在啊,感觉和优先级没啥关系
微任务优先级
与浏览器事件循环的区别
NodeJS 中的事件循环
https://www.bilibili.com/video/BV1gb4y1U7Un?spm_id_from=333.999.0.0
阮老师等14年就知道的东西哎,我真是菜,感觉人家早就财务自由了。
http://www.ruanyifeng.com/blog/2014/10/event-loop.html
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/EventLoop
拉勾教程
https://nodejs.org/en/docs/guides/event-loop-timers-and-nexttick/
参考
JS事件循环机制
0 条评论
回复 删除
下一页