《JS 函数的执行时机》

224 阅读1分钟

1.查看下面这段代码

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

上述代码的运行结果是6个6,为什么呢? 因为for循环会比任意一个setTimeout函数都先执行完毕,而for循环结束后,i的值变为6,所以打印6个6

2.如何让上述代码打印0,1,2,3,4,5

很简单,只需要在for循环声明并初始化变量i的时候使用let关键字就行,如下:

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

3.除了上述使用let关键字,还能使用什么方法呢?

  • 将变量的递增放到setTimeout的执行体中
let i=0
let j=0
for(i = 0; i<6; i++){
  setTimeout(()=>{
    console.log(j)
    j++
  },0)
}
  • 使用局部变量保存递增值
let i=0
for(i = 0; i<6; i++){
  function fn()
  {
  let a=i
  setTimeout(()=>{
    console.log(a)
  },0)
  }
  fn()
}
  • 使用立即实行函数
let i=0
for(i = 0; i<6; i++){
  !function()
  {
  let a=i
  setTimeout(()=>{
    console.log(a)
  },0)
  }()
  
}