JS函数的执行时机

JS函数中，对函数调用的时机不同，得到的结果也会不一样，例如 下面这段代码 :

let i = 0
for(i = 0; i<6; i++){
  setTimeout(()=>{
    console.log(i)
  },0)
}

执行结果如下 :

结果显示打印出来了6个6，
为什么没有打印出来0，1，2，3，4，5呢？要了解这点首先我们应该了解函数setTimeout的作用是什么。

• setTimeout(func,time)函数运行机制
  简单来说，setTimeout(func,time)是在time（毫秒单位）时间后执行func函数。浏览器引擎按顺序执行程序，遇到setTimeout会将func函数放到执行队列中，等到主程序执行完毕之后，才开始从执行队列（队列中可能有多个待执行的func函数）中按照time延时时间的先后顺序取出来func并执行。
  （参考链接：https://blog.csdn.net/I_recluse/article/details/80632321）

回看上面代码，我们发现代码实际表示循环一段时间之后才会执行console.log(i)，当i=6的时候循环停止，所以打印出来的才会是6个6。

如果要打印出来0，1，2，3，4，5的话，可以采用以下代码来实现：

for(let i=0;i<6;i++){
    setTimeout(()=>{
         console.log(i)
},0)
}

为什么把let i = 0写入for循环里面就可以实现了呢？因为JS在for和let一起用的时候会加东西，每次循环的时候会多创建一个i。

那除把初始变量通过了let i = 0写入for循环以外还有别的方法可以打印出来0，1，2，3，4，5。最容易想到的就是根据函数的执行时机可以把 console.log(i)写到setTimeout(()函数之前，我们执行一下看看是不是跟预期的一样：

let i = 0
for(i = 0; i<6; i++){
   console.log(i)
  setTimeout(()=>{
  },0)
}

执行结果如下：

在不改变代码顺序的情况下，还可以通过以下方式来实现

• 通过 setTimeout 的第三个参数,将i传进去，代码如下：

let i=0
for(i = 0; i<6; i++){
    setTimeout((value)=>{
      console.log(value)
    },0,i)
}