JS函数的执行时机

首先看举例代码：

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

---

问题1. 为什么上述代码会打印出6个6

解释：setTimeout() 方法是设置一个定时器，该定时器在定时器到期后执行一个函数或指定的一段代码。而延迟 delay 取值0，意味着“马上”执行，或者尽快执行。而在该代码中，函数马上执行的时机是，当 for 循环结束，马上执行 console.log(i) ,共执行了6次，此时 i=6 ，所以马上执行打印出6个6。类比的事件：如，老板要求正在统计数据的你，统计完马上给他结果。时机马上，不是处于事件进行中给出现在的结果，而是统计事件完成后马上给出完成的结果。

---

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

代码示例

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

解释：因为 JS引擎 在 for 和 let 一起用的时候会加东西，即每次循环会多创建一个 i 保留在每次打印代码上。

---

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

代码示例：立即执行函数

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

下面是每次循环立即执行打印当前 i\

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

然后再立即执行整个函数，得到循环结束打印出的0、1、2、3、4、5。

---

参考资料

MDN
Stack Overflow

©转载声明