JS中宏任务与微任务如何协同工作，解析event loop原理？

本文共计833个文字，预计阅读时间需要4分钟。

首先看一段代码，包含async function，然后使用await，打印f1。接着定义另一个async function f2，打印f2。之后打印正確1，然后调用f1()。设置一个setTimeout，当它执行时打印定时器。接着打印正確2。正确的打印顺序应该是：正確1，f2，f1，定时器，正確2。

首先看一段代码

async function (){ await f2() console.log('f1') } async function f2(){ console.log('f2') } console.log('正常1') f1() setTimeout(()=>{ console.log('定时器') }) console.log('正常2')

正确的打印顺序应该是：正常1，f2 ，正常2，f1，定时器

为什么会出现这样打印顺序呢

首先javascript是一门单线程语言，在最新的HTML5中提出了Web-Worker，但javascript是单线程这一核心仍未改变。既然js是单线程，那就像只有一个窗口的银行，客户需要排队一个一个办理业务，同理js任务也要一个一个顺序执行。如果一个任务耗时过长，那么后一个任务也必须等着。所以就出现了同步任务和异步任务。