js-setTimeout(setInterval)和浏览器调用堆栈

最近学习《高性能javascript》，其中对定时器setTimeout的学习总结如下：

 

1. 由于windows系统中定时器的刷新频率为15ms，建议最小延迟时间值为25ms（实际时间为15~30）（定时器的精度问题）

 

2. “UI线程"：功用于执行js和更新用户界面的进程，该线程的工作基于一个简单的队列系统，任务会被保存到队列中直到进程空闲。一旦空闲，队列中的下一个任务会被重新提取出来并运行。

 

3. 设置setTimeout，即告诉js引擎先等待一定时间，然后添加一个js任务到UI队列；第二个参数表示任务何时被添加到UI队列，而不是一定会在这段时间后执行；这个任务会等到队列中其他所有任务执行完才会执行。

 

4. js是单线程的，函数调用通过堆栈调用，设置setTimeout，会将执行函数体加入新的堆栈。

 

看示例：

function a(){
  setTimeout(function() {alert(1)}, 0);
  alert(2);
}
a();  //执行结果：先弹出2，然后在弹出1

原因分析：

给alert(1)加上setTimeout 后，alert(1)就被加入到了一个新的堆栈中等待，并“尽可能快”的执行。这个尽可能快就是指在a的堆栈完成后就立刻执行，因此实际的执行结果就是先 alert(2)，再alert(1)。在这里setTimeout实际上是让alert(1)脱离了当前函数调用堆栈。