js函数的执行时机

105 阅读1分钟

分享一道经典的题目:

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

        理解这部分代码的输出结果,其实需要掌握js函数的执行时机。如果按照顺序执行,应该会输出0——5这五个数字。但是,这里有一个定时器函数,它的意思为过一会儿执行,意思就是当两件事情同时要做的话,我先停下一件事去做另外一件事。这里的打印就是稍后要做的事。但是过了这一会儿,i都已经变成6了。所以这段代码最后会输出6个6。

那么如何打印出0-5?

 最新的js,关于这部分进行了修改。只要在for语句里面进行变量初始,就可以实现。代码如下:

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

当然,我们还可以用其他方法

  • 利用const关键字:

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

  •  我们还可以利用定时器的第三个参数:

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