JS 函数的执行时机

114 阅读1分钟

本文旨在解释for循环中如果有异步函数,为何var声明的变量为最终值。 话不多说,看代码

let i = 0
for(i = 0; i<6; i++){
  setTimeout(()=>{
    console.log(i)
  },0)
}
//依次打印输出 6个6

for循环代码,满足循环条件下执行6次,没有问题,而在setTimeout()函数里面,为什么打印输出了6,而不是0,1,2,3,4,5呢?

在这段代码中,是先执行完for循环,然后再setTimeout()里面的代码,当for循环执行完后,i最后的值为6,所以就打印输出 6个6。

那有没有办法解决这个问题呢?我就想输出0-5怎么办,有两种办法。

第一种是利用es6中的let关键字配合for循环,只需要在上面代码的基础上稍作修改即可:

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

第二种方法是利用闭包:

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