JS 函数的执行时机

155 阅读1分钟
let i = 0
for(i = 0; i<6; i++){
  setTimeout(()=>{
    console.log(i)
  },0)
}

上述代码的执行结果居然是非常反人类直觉的6个6,这主要是因为setTimeout()搞的鬼,它的作用是过一段时间,再来执行第一个参数要做的事,而第二个参数0表示的是,等做完手头的事,就不需要等待,而是立即执行第一个参数要做的事。而这边所谓的手头的事,就是执行完当前循环,循环完成后,i的值也就变成了6,此时再输出,当然会输出6个6.

解决办法如下

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

上述代码可以解决上述问题的原因是,把 let放在循环里面的时候,let会偷偷的生成一个新的变量,再 console.log时,输出的时那个被偷偷生成的变量,它将此时i的值拷贝了一份,每次输出的,都不是写在上面的 i。此外,这件事还与变量的作用域有关,

再看例子:

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

运行结果为

但是

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

所以说,如果你申明了一个全局变量,依旧无法得到想要的解