高级定时器

**关于定时器要记住的最重要的事情是**:指定的时间间隔表示何时将定时器的代码添加到队列，而不是何时实际执行代码。

定时器仅仅只是计划代码在未来的某个时间执行。执行的时间是不能保证的，因为在页面的生命周期中，不同时间可能有其他代码在控制 JavaScript 进程。在页面下载完后的代码运行、事件处理程序、Ajax 回调函数都必须使用同样的线程来执行。实际上，浏览器负责进行排序，指派某段代码在某个时间点运行的优先级。

可以把 JavaScript 想象成在时间线上运行的。当页面载入时，首先执行是任何包含在 < script> 元素中的代码，通常是页面生命周期后面要用到的一些简单的函数和变量的声明，不过有时候也包含一些初始数据的处理。在这之后，JavaScript 进程将等待更多代码执行。当进程空闲的时候，下一个代码会被触发并立刻执行。例如，当点击某个按钮时， onclick 事件处理程序会立刻执行，只要 JavaScript 进程处于空闲状态。这样一个页面的时间线类似于下图（引自高程三）

下面是有循环的代码

<div id="test">2222222222</div>

<script>

var oTest=document.getElementById("test");

oTest.onclick=function(){

var nowTime=new Date();

setTimeout(function(){

console.log("定时器的代码");

console.log(new Date()-nowTime);//534

},100);

for(var i=0;i<1000000000;i++){}

var clickTime=new Date();

console.log(clickTime-nowTime);//532

}

</script>

点击后，会发现，并不是过100毫秒执行的；如果去掉for循环，那是差不多的；