JS函数的执行时机

70 阅读1分钟

先来看一段代码:

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

这段代码的输出结果乍一看是不是觉得是0,1,2,3,4,5

而实际的输出是。。

不是setTimeout(,0)吗,不是尽快调用吗,怎么打了6个6出来?

因为尽快调用并不是马上调用。它会先将主代码执行完毕后再进行调用。

理解:[就好比工地你在数箱子,老板说数完了赶紧记一下箱子数写下来,这个时候你是不会立刻把箱子数写下来的。为什么?因为你还没有数完,你没有做完数箱子的流程。所以虽然老板说的是赶紧记一下,你却得把主流程完成才可以尽快执行]

至于为什么是6不是5,因为i=5之后i++了,等到下一个循环i=6<6条件不成立了,主流程走完了,这个很简单。

那我如果用定时器还是想打0,1,2,3,4,5怎么办

for let用法

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

结果:

原因:js在for和let一起用的时候会多加东西,每次循环会多创建一个i。并且这个i不会随着新的i变化。

理解:可以理解为刻舟求剑的魔幻版本,你每走一会在船上刻下一个记号,河里是真的会有一个剑的副本在对应刻下的位置出来的。并且这个副本不受你后面再刻记号影响,就是在那个位置。