【说说你对事件循环event loop的理解】

简介: 【说说你对事件循环event loop的理解】

浏览器执行中的线程
主线程: js引擎执行的线程,这个线程只有一个,页面渲染、函数处理都在这个线程上。
工作线程:也称幕后线程,这个线程可能存在于浏览器和js引擎内,与主线程是分开的,处理文件读取、网络请求等异步事件。
事件循环的执行顺序
任务队列(Event Queue): 所有的任务都可以分为同步任务和异步任务。
同步任务即为 立即执行的任务 ,一般直接进入主线程中执行
异步任务不进入主线程,先放到辅助线程中处理,一般分为"发起函数"和"回调函数"(如setTimeout(fn(), 100)中setTimeout为发起函数,fn为回调函数),先执行发起函数(即下图中的"挂起"),在异步任务有了结果后,将注册的回调函数放到任务队列中,等主线程空闲的时候读取,采用先进先出的机制来进行协调

同步任务和异步任务进入不同的执行环境,同步任务进入主线程栈,异步任务在相应辅助线程中处理完成后,即异步函数达到触发条件了,就把回调函数推入任务队列中,而不是说注册一个异步任务就会被放在这个任务队列中进入任务队列,主线程中的任务执行完毕之后,就会去任务队列中读取对应的任务,推入主线程执行。这个过程就是我们所说的『Event loop (事件循环)』,每一次循环称为一个tick

eventloop 与 dom渲染的关系

1.callstack清空后(结束一个轮循),即所有同步任务完成后

2.先看有没有dom渲染,如果有dom更新就去执行渲染

3.然后开始下一个eventloop.


相关文章
|
2月前
|
传感器 JavaScript 前端开发
Event Loop
【10月更文挑战第29天】
32 4
|
7月前
|
前端开发 JavaScript
深入理解JavaScript的事件循环(Event Loop)
深入理解JavaScript的事件循环(Event Loop)
|
移动开发 JavaScript 前端开发
说说你对事件循环event loop的理解?
说说你对事件循环event loop的理解?
109 0
|
7月前
|
存储 JavaScript 前端开发
说说你对Event Loop的理解是什么
Event Loop(事件循环)是JavaScript中处理异步操作的一种机制,它帮助我们协调和处理各种任务的执行顺序。
62 0
|
JavaScript Java
event loop async await 事件循环机制
event loop async await 事件循环机制
59 0
|
前端开发 JavaScript
【说说你对事件循环event loop的理解】
【说说你对事件循环event loop的理解】
|
JavaScript
event loop的理解
event loop的理解
|
JavaScript 前端开发
说说你对事件循环的理解(event loop)
说说你对事件循环的理解(event loop)
|
JavaScript 前端开发
JS引擎的执行机制event loop
JS引擎的执行机制event loop
72 0
浅析Event Loop(事件循环)
浅析Event Loop(事件循环)
121 0