JS函数执行时机解析

一、函数执行的顺序

在JavaScript中，函数的执行顺序是按照代码的书写顺序依次执行的。然而，当涉及到异步函数时，情况就变得有些不同了。异步函数是指不会立即执行的函数，而是会在一段时间后才执行。

二、setTimeout()函数

setTimeout()函数是一个内置的JavaScript函数，用于在指定的时间后执行一段代码。其语法格式为：

setTimeout(function, milliseconds);

其中，function是要执行的代码，milliseconds是延迟的时间，单位是毫秒。

三、for循环

for循环是一种循环结构，用于重复执行一段代码。其语法格式为：

for (initialization; condition; increment) {
  // 要执行的代码
}

其中，initialization是循环的初始化语句，condition是循环的条件语句，increment是循环的增量语句。

四、setTimeout()与for循环的执行时机

现在，我们来看一下setTimeout()函数和for循环的执行时机。假设我们有如下代码：

for (var i = 0; i < 5; i++) {
  setTimeout(function() {
    console.log(i);
  }, 1000);
}

这段代码的作用是，创建一个for循环，循环5次，每次循环都创建一个setTimeout()函数，并在1秒后输出当前的i值。

然而，当我们运行这段代码时，会发现输出的结果并不是0-4，而是5个5。这是因为setTimeout()指定的代码，必须等到本次执行的所有代码都执行完，才会执行。也就是说，for循环执行完之后，setTimeout()函数才会执行。

五、解决方法

为了解决这个问题，我们可以使用闭包来解决。闭包是指内部函数可以访问外部函数的作用域的变量。

我们可以将for循环中的i值作为闭包的参数传递给setTimeout()函数，这样就可以保证setTimeout()函数执行时，能够正确地访问到i值。

修改后的代码如下：

for (var i = 0; i < 5; i++) {
  (function(i) {
    setTimeout(function() {
      console.log(i);
    }, 1000);
  })(i);
}

现在，运行这段代码，输出的结果就是0-4了。

六、总结

通过这个例子，我们可以看到，setTimeout()函数和for循环的执行时机是不同的。setTimeout()函数会在本次执行的所有代码都执行完之后才执行。如果我们需要在for循环中使用setTimeout()函数，则需要使用闭包来解决。