Javascript异步setTimeout与setInterval解析

setInterval

定义和用法

setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。

setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。

setTimeout

定义和用法

setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式。

demo1解析：

先后打印的结果是：

‘one’’three’’two’

原因：

回调时，被回调的函数会被放在event loop里，等待线程里的任务执行完后才执行event loop里的代码。 因此，上述代码会先把线程里的执行完后，再执行event loop里的setTimeout函数.。

这里的setTimeout是一个异步的过程，调用setTimeout时，把函数参数，放到事件队列中。等主程序运行完，再调用。

demo2:

  for(var i = 1; i <3; i++) {

         setTimeout(function(){

              console.log(i);

         },100);

   }

打印出来的结果是：3，3，3

解析：

因为js 是单线程的，setTimeout是异步执行的，所以当我们调用setTimeout时候，会有一个延时事件排入队列的队尾;

1. 执行for循环
2. setTimeout 异步执行，先暂存起来，等待执行
3. 待所有程序执行完，处于空闲状态时，拿到暂存的函数在指定的时间后执行，这个时候for循环里的值已经是3了。