开发小技巧Web前端之路让前端飞

JS的单线程异步是什么回事?

2017-07-15  本文已影响338人  柯秋

这个问题来自某次讲课某学长对我们的提问,课后记下了这个问题,在这里简单的说一下自己的理解,有错请帮忙指正~


学习web的同学都知道,javascript是一门单线程语言,单线程即代码从上至下顺序执行。但是js还有一个特性是“异步”,很多人就会觉得这岂不是自相矛盾?其实不然。

所谓单线程,是指负责解释并执行JS代码的线程只有一个,而真正在浏览器运行时还有其他很多线程,常见的有定时器线程(setTimeout/setInterval)及HTTP请求线程等。这三部分就是我们最常见的js异步。

关于JS异步问题,下面是高程(javascript高级程序设计)上的解释:

除了主JavaScript执行进程外,还需要一个在进程下一次空闲时执行的代码队列。随着页面生命周期推移,代码会按照执行顺序添加入队列,例如当按钮被按下的时候他的事件处理程序会被添加到队列中,并在下一个可能时间内执行。
在接到某个Ajax响应时,回调函数的代码会被添加到队列。JavaScript中没有任何代码是立即执行的,但一旦进程空闲则尽快执行。
定时器对队列的工作方式是,当特定的时间过去后,将代码插入,注意添加到队列并不意味着它会马上执行,而只能说它会尽快执行,设定一个150ms后执行的定时器,不代表150ms后它会马上执行,它只会表示在150ms后被加入到队列中,如果这个时间点队列是空闲的,那么这段代码就会被执行;其他情况下,代码可能明显地等待更长时间才执行。

只看完这么一大段文字可能的确有些晕乎,那我们来一点点分析~

下面来一个小例子,请问输出的顺序应该是什么呢?

<script type="text/javascript">
  console.log(1);
  setTimeout(function(){
  console.log(2);
  },0);     //注意这里间隔0秒
  console.log(3);
  </script>

如果单单以单线程的思路去想,代码肯定是自上至下的顺序执行,那么输出顺序必然是:1,2,3.但是这段代码实际的执行结果是按顺序输出:1,3,2.这是为什么?
我来总的细说一下:

(1).JS是单线程的没错,意思是指浏览器运行过程中用来解释运行js程序的过程是一个单线程的过程。

(2).浏览器是多线程的,这些线程在内核控制下相互配合以保持同步:js线程,定时器线程,HTTP请求线程。。。之类

(3).当js代码执行时,如果遇到定时器函数或者Ajax请求时,这就是其他线程的事情啦!定时器线程和HTTP请求线程都各自异步的执行完这一份的事件后,把
回调函数返回给了js线程中的任务队列的最后!!也就是说这些回调函数不一定是立即执行,只有在js线程中的所有任务都执行完之后才会调用这些回调。所以刚才的代码输出顺序是: 1,3,2.

可以参考这篇博客中的图来理解一下 [1]看过一个画得很详细的图

我的想法大概就是这些,3Q~ 感谢阅读

上一篇下一篇

猜你喜欢

热点阅读