javascript - 一个setTimeout的问题

Question

function test() {

  var a = 1;
  setTimeout(function() {
    alert(a);
    a = 5;
  }, 1000);
  a = 19;
setTimeout(function() {
   alert(a);
    a = 4;
  }, 3000);
}
test();
alert(0);

想问一下，为什么最后会弹出5？

Answer 1

首先建议题主看一篇关于JavaScript文章
JavaScript Event Loop运行机制详解

这篇文章详细阐述了JavaScript事件轮询的原理

下面来说说题主的问题：

1、主线程会先执行，当执行到test()的时候两个setTimeout会同时被放进任务队列，然后执行alert(0)，所以首先输出 0，此时a的值是19，因为setTimeout还没执行，a没有其他赋值机会;

2、主线程执行完毕然后轮询任务队列执行定时任务，由于第一个setTimeout时间较第二个短，因此首先执行第一个setTimeout的回调，此时约1s后alert(a)会输出上一步的19，然后a被赋值为5；

3、接着便执行第二个setTimeout，因为两个setTimeout同时被放进队列里面，所以这里大约会在2s后执行第二个setTimeout的回调，此时会输出上一步得到的5，然后a被赋值为4。之所以是大约2s是因为Javascript定时器并不精确

Answer 2

自己的debug 了解机制会更透彻

Answer 3

第一个定时器执行完 全局的a就已经变成5了
test函数中a的变化：1-19-5-最后一次alert(a)-4