事件循环机制(1)——浏览器

事件循环机制决定了我们所写的 JavaScript 代码的执行顺序。JavaScript的特性是单线程异步非阻塞,而这个线程中拥有唯一的事件循环。

基本概念

JavaScript代码的执行过程中,依靠函数调用栈来搞定函数的执行顺序,依靠任务队列(task queue)来搞定另外一些代码的执行。一个线程中,事件循环是唯一的,但是任务队列可以拥有多个。任务队列又分为 macro-task(宏任务)与 micro-task(微任务),在最新标准中,它们被分别称为 task 与 jobs。

  • macro-task:script(整体代码),setTimeout,setInterval,I/O,UI rendering

  • micro-task:Promise,Object.observe(已废弃),MutationObserver(html5新特性)

setTimeout/setInterval/Promise/MutationObserver 的执行是同步的,但是他们可以通过声明回调函数或者 then 方法,把任务推入任务队列,等待下一次循环执行。

事件循环执行顺序

事件循环的顺序,决定了JavaScript代码的执行顺序。它从 script(整体代码) 开始第一次循环。之后全局上下文进入函数调用栈。直到调用栈清空(只剩全局),然后执行所有的 micro-task 。当所有可执行的 micro-task 执行完毕之后。循环再次从 macro-task 开始,找到其中一个任务队列执行完毕,然后再执行所有的micro-task,这样一直循环下去。而其中每一个任务的执行,无论是 macro-task 还是 micro-task,都是借助函数调用栈来完成。

参考链接