文章目录

• 事件循环和异步IO
• 一、事件循环是什么？
• 二、进程和线程
• 1.多进程多线程开发
• 2.浏览器和JavaScript
• 三、JavaScript执行过程
• 四、浏览器的事件循环
• 五、宏任务和微任务

事件循环和异步IO

一、事件循环是什么？

• 浏览器的事件循环是一个我们编写的JavaScript代码和浏览器API调用（setTimeout/Ajax/监听事件等）的一个桥梁，桥梁之间他们通过回调函数进行沟通。
• Node的事件循环是一个我们编写的JavaScript代码和系统调用（file system、network等）之间的一个桥梁，桥梁之间他们通过回调函数进行沟通。
  

二、进程和线程

进程和线程是操作系统中的两个概念：

直观一点解释：

再用一个形象的例子解释：

1.多进程多线程开发

2.浏览器和JavaScript

浏览器是一个进程吗，它里面只有一个线程吗？

但是JavaScript的代码执行是在一个单独的线程中执行的

三、JavaScript执行过程

四、浏览器的事件循环

如果在执行JavaScript代码的过程中，有异步操作呢？

• 中间插入了一个setTimeout的函数调用
• 这个函数被放到调用栈中，执行会立即结束，并不会阻塞后续代码的执行
  

那么，传入一个函数（比如我们称之为timer函数），会在什么时候被执行呢？

• 事实上，setTimeout是调用web api，在合适的时机，会将timer函数加入到一个事件队列中
• 事件队列中的函数，会被放到调用栈中，在调用栈中被执行
  

五、宏任务和微任务

事件循环中并非只维护一个队列，事实上是有两个队列：

• 宏任务队列（ macrotask queue ）：ajax、setTimeout、setInterval、DOM监听、UI Rendering等
• 微任务队列（ microtask queue ）：Promise的then回调、Mutation Observer API、queueMicrotask() 等

那么事件循环对于两个队列的优先级是怎样的呢？

1. main script 中的代码优先执行（编写的顶层script代码）
2. 在执行任何一个宏任务之前（不是队列，是一个宏任务），都会先查看微任务队列是否有任务需要执行

接下来通过一道题来理解一下 ⭕️ ==>