浏览器渲染进程
浏览器的渲染线程大概有以下几种：
（1）GUI线程；（2）JS引擎线程；（3）事件触发线程；（4）定时器线程；（5）异步的http网络请求线程
JavaScript单线程是指浏览器在解释和执行javascript代码时只有一个线程，即JS引擎线程。
js引擎线程与GUI渲染线程是互斥的，也就是执行代码时，渲染会被挂起，渲染DOM时，js代码不执行。
js是单线程，但是渲染进程中是多线程的，在代码中遇到了像定时器setTimeout，DOM事件，http请求任务时会转交给其他线程去处理的。执行完毕后回调函数添加到任务队列，这里的执行完毕指的是，比如定时器时间到了，ajax请求成功了，对应的回调就会添加到任务队列中。
浏览器事件机制
浏览器在执行js代码时，会维护一个执行栈和任务队列。所有的同步任务都放入执行栈，异步任务都放入任务队列。当执行栈中当任务执行完毕后，浏览器会去任务队列中寻找任务，先进入任务队列的先执行。
宏任务和微任务
如果两个不同种类的异步任务执行后，哪个会先执行？比如setTimeout的回调和Promise的回调。这就要提到宏任务和微任务。
- 宏任务（Macro Task）：js同步执行的代码块，setTimeout、setInterval、XMLHttprequest等。
- 微任务（Micro Task）：promise、process.nextTick（node环境）等。
setTimeout/Promise 等API便是任务源，而进入任务队列的是由他们指定的具体执行任务。来自不同任务源的任务会进入到不同的任务队列。
setTimeout等宏任务的回调进入宏任务队列。
Promise等微任务等回调进入微任务队列。
EventLoop中，每一次循环称为tick，每次循环的执行步骤如下：
- js引擎线程中的执行栈会首先执行宏任务（一般是script），执行完所有的同步代码；根据任务的类型的不同，将异步代码的回调添加到宏任务队列和微任务队列中
- 宏任务执行完后，检查微任务队列，执行完所有微任务
- 微任务队列清空后，如果宿主为浏览器，可能会渲染页面，浏览器也会相应的优化，多个tick后合并成一次渲染页面
- 开始下一轮tick，宏任务队列中拿出一个宏任务（注意是一个宏任务，setTimeout等回调）执行
上面的步骤依次执行，实现一个闭环，也就是事件循环。
JavaScript 是一门单线程语言，异步操作都是放到事件循环队列里面，等待主执行栈来执行的，并没有专门的异步执行线程。
eg：
setTimeout(() => {
console.log(1);
}, 0);
new Promise((resolve) => {
console.log(2);
resolve();
}).then(() => {
console.log(3);
});
new Promise((resolve) => {
console.log(4);
resolve();
}).then(() => {
console.log(5);
});
console.log(6);
console.log(7);
分析一下：
- 执行栈先执行宏任务，遇到setTimeout，定时器线程处理定时，0s立即将回调加入宏任务队列；
- 继续执行，Promise的console.log(2);直接执行，then后的回调放入微任务队列；
- Promise的console.log(4);执行，then后回调放入微任务队列；
- 执行console.log(6); console.log(7);
- 执行完毕，去找微任务队列，依次执行console.log(3); console.log(5);
- 微任务队列清空，执行宏任务队列，console.log(1);
所以，输出顺序为2，4，6，7，3，5，1。
