JS异步与单线程

我们先感受下异步。

console.log("start");

setTimeout(function () {

    console.log("medium");

}, 1000);

console.log("end");

使用异步后，打印的顺序为 start-> end->medium。因为没有阻塞。

为什么会产生异步呢？

首先因为 js 为单线程，也就是说 CPU 同一时间只能处理一个事务。得按顺序，一个一个处理。

如上例所示，第一步：执行第一行打印 “start”；第二步：执行 setTimeout，将其中的函数分存起来，等待时间结束后执行；第三步：执行最后一行，打印 “end”；第四部：处于空闲状态，查看暂存中，是否有可执行的函数；第五步：执行分存函数。

为什么 js 引擎是单线程？

js 的主要用途是与用户互动，以及操作 DOM，这决定它只能是单线程。例：一个线程要添加 DOM 节点，一个线程要删减 DOM 节点，容易造成分歧。

为了更好使用多 CPU，H5 提供了 web Worker 标准，允许 js 创建多线程，但是子线程受到主线程控制，而且不得操作 DOM。

任务列队

单线程就意味着，所有的任务都要排队，前一个结束，才会执行后面的任务。如果列队是因为计算量大，CPU 忙不过来，倒也算了。但是更多的时候，CPU 是闲置的，因为 IO 设备处理得很慢，例如 ajax 读取网络数据。js 设计者便想到，主线程完全可以不管 IO 设备，将其挂起，然后执行后面的任务。等后面的任务结束掉，在反过头来处理挂起的任务。

好，我们来梳理一下：

1）所有的同步任务都在主线程上执行，行程一个执行栈。

2）除了主线程之外，还存在一个任务列队，只要一步任务有了运行结果，就在任务列队中植入一个时间。

3）主线程完成所有任务，就会读取列队任务，并将其执行。

4）重复上面三步。

只要主线程空了，就会读取任务列队，这就是 js 的运行机制，也被称为 event loop（事件循环）。

原文地址：https://mp.weixin.qq.com/s?__biz=MzIzNTU2ODM4Mw==&mid=2247487783&idx=1&sn=9317135c552a8e50cef052d2927a74d3&chksm=e8e47cb7df93f5a1c23d4848ced4cac2a24038fe70eb290eeb0a8f58acfe36ca1a5cfab78598&mpshare=1&scene=23&srcid=%23rd