js函数的执行时机

142 阅读2分钟

函数的执行时机十分重要,不同执行时机得到的结果便也不同,通过几个例子来具体说明

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

上面setTimeout这个函数的作用就是设置时间为0秒后打印出i,但是这个函数是镶嵌在for循环里面的,这就涉及到是先将for循环执行完毕以后,再执行这个setTimeout函数,还是一边执行for循坏,一边执行setTimeout.而我们大多数人都觉得应该是后者,但是真理往往是掌握在少数人手里的,前者才是对的。一个通俗的例子会更有助于理解,当你正在打游戏的时候,你妈妈让你去写作业,那你肯定是打完这局游戏再去写作业了。所以执行for循环完毕时,i已经变成了6,所以会打印出6,因为执行了六次setTimout,自然就会打印出六个六。

由于很多人都觉得应该是边执行for循环边执行setTimeout,好既然大家都这么希望然后js为了满足大家的期望确实做到了,请看下面代码:

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

只要在加上这个let,JS在forlet连用的时候会加点东西,导致每次循环的时候都会多创建一个i,每次的i只在本轮循环有效,等下一次循环就会新建一个i,而JavaScript引擎内部会记住上一轮循环的值,初始化本轮的变量i时,就在上一轮循环的基础上进行计算那么上面代码的结果自然就变成我们所期待那样,打印出0、1、2、3、4、5.