JS 函数的执行时机

94 阅读1分钟

解释为什么如下代码会打印 6 个 6

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

对上面代码来说, let 定义的变量 在定义的时候形成了一个作用域, 此时的作用域 短暂的理解为 到for() {},当js 从上往下执行的时候, 遇到 for(){} 代码的时候, 会判断当前i 的值 < 6 , 大于6 的时候就会跳出循环, 此时我们就只需要关注前5次的执行

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

当代码 执行到这里的时候, 循环一次, 就会产生一个定时器,等待执行( 特别提示: 每一次循环并不会打印,而是生成一个定时器), 循环五次就会产生5个定时器, 在循环完毕的时候, 就会去执行者六个定时器, 而此时的的 i的值已经是循环完毕的值 也就是 6, 所以此时会执行for 语句添加的5个定时器去console.log(i), 到这里已经弄明白为啥打印出来的是6啦

写出让上面代码打印 0、1、2、3、4、5 的方法

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

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

// 方法一
for( var i = 1 ; i < 6 ; i++ ){
    (function(i){

        setTimeout( function(){

            console.log( i )

        },0 )

    })(i)
}

//方法二
for(var i = 0; i < 10; i++) {
    setTimeout((function(e) {
        return function() {
            console.log(e);
        }
    })(i), 1000)
}