javascript - JavaScript 'for' 循环中的执行顺序是什么？

Question

这篇文章是这篇文章的简化版本:

What is the exact order of execution of Javascript's for loop?

我对为什么我在使用 for 循环时总是感到困惑非常感兴趣。我想了解如何在幕后执行 for 循环。

for (let i = 0; i < 10; i++) {
  alert(i);
};

因此，据我所知，这是我对执行此类操作的顺序的理解:

1) 引擎初始化i = 0

2) 引擎检查 i < 10

3) 引擎弹出 for 语句所在的括号

4) 引擎在本次迭代的循环内执行代码

5) 引擎弹回到括号中以递增 i ,

6) 从步骤 2 开始重复。

我想我最困惑的是第 3 步。引擎是否真的跳出了“for”循环以执行 block 内的代码？

据我了解，JavaScript 是单线程的，只能同步运行，所以我有点困惑，引擎如何在“for”语句的中间保持“for”的状态在 block 中执行代码时内存.... unless 'for' 循环中的三个条件中的每一个都是它们自己独立的命令，可以在继续执行内部命令之前执行并完成 block 。

我什至不确定我问的这个问题是否正确，我对编程还是比较陌生，目前我只知道 vanilla JS...下个月是我进入 node 的时候 ;)

想通了: Click for an image of my breakpoint placement

我了解到顺序是这样的: 1) var i初始化为 0

2) var i检查真实性

3) 如果为真，则执行代码，

4) 一旦执行完成，i递增

5) 加一，i检查真实性

6) 重复步骤 3 - 5 直到 i是假的

7) 迭代完成。

谢谢大家。 Chrome 调试器比我想象的要强大得多!

Answer 1

(抱歉没有足够的代表将其放入评论中)

我建议使用浏览器调试功能。我不确定您使用的是什么浏览器，但只需谷歌“使用 X 浏览器调试 JS”，那里有很多教程。

首先，创建一个简单的 for 循环 htm 文件。然后打开浏览器并初始化调试器。然后在浏览器中打开文件。打开“源代码”部分，您的代码将可见。单击带有 for 循环的行并设置一个断点，并在您的变量(如 i)上创建监视。

然后重新加载 htm 文件，调试器将在断点处停止。然后一步步“步入”for循环。您将能够观察系统如何通过代码查看每个步骤，您可以观察变量的变化，希望这能让您深入了解它是如何工作的。

这是理解您可能拥有的任何复杂代码并轻松调试错误的好方法。