setInterval 和setTimeout

它们都处在一个单一线程中

• var id = setTimeout(fn, delay); - 初始化一个单一的timer，这个timer将会在一定延时后去调用指定的函数。这个函数（setTimeout）将返回一个唯一的ID，我们可以通过这个ID来取消timer。

• var id = setInterval(fn, delay); - 与setTimeout类似，只不过它会持续地调用指定的函数（每次都有一个延时），直到timer被取消为止。

• clearInterval(id);, clearTimeout(id); - 接受一个timer的ID（由上述的两个函数返回的），并且停止timer的回调事件。

定时器的延时是没有保证的。由于所有在游览器执行的js都是单线程异步事件(比如鼠标单击和定时器)，执行过程中只有在有空闲的时候才会被执行。通过下图可以很好的说明这一观点：

js只能在某一时刻执行一小段代码(由于它的单线程天性)，这些执行代码块中的每个都会"阻塞"其他异步事件的进行。这意味着当一个异步事件发生时(如鼠标单击事件，定时器触发，或者异步请求完成时)，它会排队等待执行(至于队列实际上是如何排列的,想必各个游览器表现都会不一样，所以这样考虑是一个简化)。

这个例子更好地阐释了setTimeout和setInveral之间的区别。

  setTimeout(function(){
    // 一个很长的代码块……
   setTimeout(arguments.callee, 10);
  }, 10);
 
  setInterval(function(){
    //一个很长的代码块…… 
  }, 10);

 

乍看上去，这两段代码在功能上似乎是相同的，可实际上并非如此。setTimeout的代码在前一次的回调执行完后总是至少会有10ms的延时（有 可能会更多，但是绝对不会更少）；而setInterval则总是在每10ms的时候尝试执行一次回调，它不管上一次回调是什么时候执行的。

1. 无论是setTimeout还是setInterval，触发时，如果当前进程不为空，都得去排队等待执行，这一点上是无差异的。

2. 区别是，setTimeout只需排一次队，setInterval则需要按照预设的间隔时间，每到时间点都去排一下。

3. setInterval去排队时，如果发现自己还在队列中未执行，则会被drop掉。也就是说，同一个inerval，在队列里只会有一个。

4. 因为队列机制，无论是setTimeout还是setInterval，第一次触发时的时间，只会等于大于预设时间，不可能小于。

5. 对于setInterval来说，如果执行时间大于预设间隔时间，很可能导致连续执行，中间没有时间间隔，这是很糟糕的，很可能会耗费大量cpu.

因此，对于动画来说，如果单帧的执行时间大于间隔时间，用setTimeout比用setInterval更保险。

在JS脚本中，多个setInterval之间会出现干扰！

不能同时执行是肯定的，必然有一个先后次序

参考http://www.cnblogs.com/youxin/p/3354924.html

转载于:https://my.oschina.net/homeemail/blog/309599