JS 函数的执行时机

91 阅读1分钟

代码:

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

**思考:**为什么上面代码会答应出6个6

**解释:**setTimeout(()=>{console.log(i)},0)},这行代码的意思是,一段时间内尽快执行console.log(i),如何为尽快呢,就是把for循环执行完再执行,for循环到最后的赋值条件i++,i的值已经为6,这个for循环一共跑了6次,最后的值为6,所以打印出6个6。(相当于每一次的setTimeout都设定了一个闹钟,但是是最后才一起响的)

写出让上面代码打印 0、1、2、3、4、5 的方法

代码如下:

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

其他解决办法:

解决办法:人为给 console.log(i); 创造作用域,保存i的值。

for (var i = 0; i < 6; i++) {            

              (function(i){ //立刻执行函数             

               setTimeout(function (){             

               console.log(i); },0);             

               })(i);  }

**解释:**因为 setTimeout 的 console.log(i); 的i是 var 定义的,所以是函数级的作用域,不属于 for 循环体,属于 global。等到 for 循环结束,i 已经等于 6了,这个时候再执行 setTimeout 的六个回调函数,里面的 console.log(i); 的 i 去向上找作用域,只能找到 global下 的 i,即 6。所以输出都是 6。