简单记录下JS函数执行时机

JS函数执行时机把我搞的很懵逼,在这里记录下,如有错误,请指正.

为什么如下代码会打印 6 个 6呢?

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

上面代码为啥输出是6个6的原因:

1. for循环里面的变量i 是 全局 的 相当于等于 var i= 0 .
2. setTimeout 是等一会才执行,此时for循环已经执行完了,所以会输出6个6.
3. 有人奇怪 i 不应该是5吗。i = 5 满足条件(<6)是最后一轮循环，然后i++，i 为6。这个循环自始至终都是在改变一个 i 的值。所以会打印6个6。

那我就是想要符合预期的打印0、1、2、3、4、5呢?

for(let i = 0; i<6; i++){
   setTimeout(()=>{
       console.log(i)
   },0)
}
// 0 1 2 3 4 5


这里 let 就会单独创建一个作用域 相当于有6个 i 。

(let i = 0) {
   setTimeout(()=>{
       console.log(i)
   },0)
}

(let i = 1) {
   setTimeout(()=>{
       console.log(i)
   },0)
}

(let i = 2) {
   setTimeout(()=>{
       console.log(i)
   },0)
};
(let i = 3) {
   setTimeout(()=>{
       console.log(i)
   },0)
}

(let i = 4) {
   setTimeout(()=>{
       console.log(i)
   },0)
}

(let i = 5) {
   setTimeout(()=>{
       console.log(i)
   },0)
};

还有另外一种方法也可以得到预期的结果

for (var i = 0; i < 6; i++) {
    setTimeout((function(i){
        return function() {
            console.log(i);
        }
    }(i)),0)
}
// 0 1 2 3 4 5