JS执行机制——同步和异步

js是单线程

JavaScript语言的一大特点就是单线程，即同一时间只能做一件事。

这是因为JS这门脚本语言诞生的使命所致————JS是为处理页面中用户的交互，及操作DOM而诞生的。比如我们对某个DOM元素进行添加和删除操作，不能同时进行，应先添加后删除。

• 单线程就意味着，所有任务需要排队，前一个任务结束，才会执行后一个任务。这样所导致的问题是：如果JS执行时间过长，这样就会造成页面的渲染不连贯，导致页面渲染加载阻塞的感觉。

同步和异步

为了解决加载阻塞的问题，利用多核CPU的计算能力，HTML5提出Web Worker标准，允许JS脚本创建多个线程。因此，JS中出现了同步和异步。

什么是同步

前一个任务结束后再执行后一个任务，程序的执行顺序与任务的队列顺序是一致的、同步的。

比如泡茶的同步做法：先烧开水（10分钟后），再去拿出茶叶，准备好泡茶用具。

什么是异步

在执行一个需要花费很长时间的任务时，还可以执行其它任务。

比如泡茶的异步做法：在烧水（10分钟）的同时，我们可以利用这段时间去拿出茶叶，准备好泡茶用具。

它们本质上的区别：流水线上各个流程的执行顺序不同。

---

同步任务

同步任务都在主线程上执行，形成一个执行线。

异步任务

JS的异步是通过回调函数实现的。

一般有三种类型：

• 普通事件：如click、resize等 （事件发生，任务才会被异步进程处理放入任务队列中）
• 资源加载：如load、error等
• 定时器：包括setInterval、setTimeout等

异步任务相关回调函数添加到任务队列（消息队列）中。

---

JS执行机制

1.先执行执行栈中的同步任务。
2.异步任务（回调函数）放入任务队列中。
3.执行栈中的所有同步任务执行完毕后，系统会按次序读取任务队列中的异步任务，于是被读取的异步任务结束等待状态，进入执行栈中开始执行。

由于主线程不断重复获得任务、执行任务、再（去任务队列）获取任务，所以这种机制被称为事件循环（event loop）。