关于setTimeout深度理解

这两天在学习过程中，经常用到了setTimeout( ) 方法，详细了解后发现，这个方法并不是以前想的那么简单，网上看了很多网友的实例，很受启发。
下面根据实例再来重新梳理一下

1.setTimeout( )基本概述

setTimeou方法可以使函数按要求延迟一段时间执行，并且可以传递参数

setTimeout(function/code, milliseconds, param1, param2, ...)

function|code   //调用一个函数 或是代码串。
//注意：若是使用代码串，则需要输入字符串，给代码加上引号。引擎会直接用eval将字符串转化成代码执行。若是函数则不用加上引号
milliseconds    //代码执行间隔的时间
param1、param2、...  //所要传递的参数，此项可以不填

html 5标准规定，setTimeout的最短时间间隔是4毫秒。对于那些不处于当前窗口的页面，浏览器会将时间间隔扩大到1000毫秒。
所以说，有时候尽管设置延迟时间为0，setTimeout也会使用最短延迟时间。

2.setTimeout在对象的回调函数中的this

当setTimeout中的函数要调用某个对象的方法时，这时setTimeout的回调函数中，this是指向window的，也就是指向全局

var x = 1;
var o = {
  x: 2,
  y: function(){
    console.log(this.x);
  }
};
setTimeout( o.y ,1000);// 1

上面的代码很明显，y属性的函数中this原本是指向对象o，当使用setTimeout调用时，this指向了外部的全局

3.setTimeout运行机制

setTimeout和setInterval的运行机制是，将指定的代码移出本次执行，等到下一轮Event Loop时，再检查是否到了指定时间。如果到了，就将事件添加到任务队列的尾部，并执行对应的代码；如果不到，就等到再下一轮Event Loop时重新判断。这意味着，setTimeout指定的代码，必须等到本次执行的所有代码都执行完，才会执行。

4.结合for循环实例

网上看了几个很有意思的实例，记录下来

for (var i = 0; i < 5; i++) {
  setTimeout(function() {
    console.log(i);
  }, 1000 * i);
}

setTimeout 会延迟执行，那么执行到 console.log 的时候，其实 i 已经变成 5 了
所以上面的代码会输出5个5

那么怎么改才能输出 0 到 4 呢？
加一个闭包就行

for (var i = 0; i < 5; i++) {
  (function(i) {
    setTimeout(function() {
      console.log(i);
    }, i * 1000);
  })(i);
}