eventloop运行顺序

1、一段简单代码的运行顺序

	<script type="text/javascript">
		console.log('script start')
		setTimeout(()=>{
			console.log('settimeout')
		},0)
		Promise.resolve().then(function() {
		  console.log('promise');
		});
		console.log('script end')
	</script>

运行顺序： script start -> script end -> promise -> settimeout

1. 首先执行script宏任务
2. 执行同步任务script start->script end
3. 执行微任务promise
4. 执行settimeout宏任务

2、浏览器完整的Event Loop segmentfault.com/a/119000001…

1. 执行全局Script同步代码，这些同步代码有一些是同步语句，有一些是异步语句（比如setTimeout等）；
2. 全局Script代码执行完毕后，调用栈Stack会清空；
3. 从微队列microtask queue中取出位于队首的回调任务，放入调用栈Stack中执行，执行完后microtask queue长度减1；
4. 继续取出位于队首的任务，放入调用栈Stack中执行，以此类推，直到直到把microtask queue中的所有任务都执行完毕。注意，如果在执行microtask的过程中，又产生了microtask，那么会加入到队列的末尾，也会在这个周期被调用执行；
5. microtask queue中的所有任务都执行完毕，此时microtask queue为空队列，调用栈Stack也为空；
6. 取出宏队列macrotask queue中位于队首的任务，放入Stack中执行；
7. 执行完毕后，调用栈Stack为空；
8. 重复第3-7个步骤；
9. 重复第3-7个步骤；
10. ......

从整体来看event loop

www.ruanyifeng.com/blog/2013/1…

Event Loop的一些基础概念

juejin.cn/post/684490…

参考

segmentfault.com/a/119000001…