JavaScriptJS 函数的执行时机

196 阅读1分钟

以下代码为何会打印出6个6

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

用一段测试代码佐证想法

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

test()
console.log('i run too')

//输出结果为
//i run
//i run too
//6 6遍
//可以得出结论,setTimeout函数会在当前代码块执行完毕后再去执行,而此时
//的i已经被赋值为6退出循环,等setTImeout函数打印时i已经不是传入时的值,i已
//经被赋值为6,所以打印出6个6

如何让上面代码打印 0、1、2、3、4、5

for(let i = 0; i<6; i++){
  setTimeout(()=>{
    console.log(i)
  },0)
}
console.log('i run')
//将let i=0 写在for循环的初始化中可达成效果
//let i在每次循环相当于重新声明了一次,其中的处理js帮我们做了

除了使用 for let 配合,还有什么其他方法可以打印出 0、1、2、3、4、5

setTimeout mdn上的介绍
arg1, ..., argN 可选
附加参数,一旦定时器到期,它们会作为参数传递给function
所以可以将i传递给function来实现
let i
for(i = 0; i<6; i++){
    setTimeout((index)=>{
      console.log(index)
    },0,i)
}