JS函数的执行时机

先看一段代码

let i = 0;
for (i = 0; i < 6; i++) {
    setTimeout(() => {
        console.log(i)
    }, 0)
}
// 执行输出 6，6，6，6，6，6

这里输出6个6是因为是JavaScript在执行的时候，会将setTimeout()放入任务队列，等待主线程的执行(不阻塞主线程)全部执行完成后，再通过event loop去询问任务队列中是否有可执行的代码，再继续放入主线程中执行。即for循环执行完成后再去执行setTimeout()。

而变量i是全局变量，每一次循环，变量i的值都会发生改变，循环结束执行setTimeout()，此时i的值为6，所以就会打印出6个6。

有什么方法可以打印出0，1，2，3，4，5呢 ？

方法1： 使用局部变量

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

let声明的变量只在本轮循环有效，所以每一次循环的i其实都是一个新的变量。JavaScript 引擎内部会记住上一轮循环的值，初始化本轮的变量i时，就在上一轮循环的基础上进行计算。

__方法2： __去掉setTimeout

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

方法3： 为setTimeout添加参数

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

一旦定时器到期，它们会作为参数传递给function。

方法4： 使用闭包

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