javascript中的for循环是如何执行的？

Posted 2023-03-15

【中文标题】javascript中的for循环是如何执行的？

【英文标题】：How are for loops executed in javascript?

【发布时间】：2012-06-22 02:51:42

【问题描述】：

我不知道如何最好地处理 javascript 中的 for 循环。希望了解for 循环将有助于阐明其他类型的循环。

示例代码

for (var i=0; i < 10; i=i+1) 
    document.write("This is number " + i);

我的理解是，当i 被初始化时，它以0 的值开始，然后根据条件< 10 进行评估。如果小于10，则执行语句document.write("This is number + i);。一旦执行了前面的语句，只有在它才会将下一个值增加1。

我咨询过的指南：

http://www.functionx.com/javascript/Lesson11.htm http://www.cs.brown.edu/courses/bridge/1998/res/javascript/javascript-tutorial.html#10.1 http://www.tizag.com/javascriptT/javascriptfor.php

现在http://www.functionx.com/javascript/Lesson11.htm 的指南似乎另有说明，即

要执行这个循环，需要检查开始条件。这通常是 应该开始计数的初始值。接下来，条件 被测试；此测试确定循环是否应该继续。如果 测试呈现一个真实的结果，然后使用表达式来修改 循环和语句被执行。声明发布后 执行后，循环重新开始。

抛出我的行是“如果测试呈现真实结果，则表达式用于修改循环并执行语句”。这似乎暗示因为0小于10，增量表达式被修改为0 + 1和THEN语句，例如document.write 被执行。

我的问题

解释for 循环的正确方法是什么？我自己的理解正确吗？相同的理解是否适用于其他编程语言，例如PHP、Perl、Python 等？

【问题讨论】：

它应该像 C 和 Java 中的 for 循环一样工作。我猜最后一个来源是错误的？

here is a reference of how loops work。我知道链接的问题是关于 Java 但它们的工作方式相同。添加continue 语句时会有更多细微差别，但至少这是一个开始。

您对语言问题的主要参考应该始终为ECMA-262（请参阅Felix 的回答）。其他参考资料可能会有所帮助，但也可能包含错误和错误。

顺便说一句，您应该已经能够确认（或反驳）您的理解，只需执行此语句即可。你得到哪个输出？ jsfiddle.net/UJsfL

P.S. functionx.com 是一个糟糕的资源。有例子调用变量Number,,,

【参考方案1】：

考虑如下的for循环

for(initializers; condition; postexec) 
    execution

当循环首次启动时，代码var i = 0 会运行。这会初始化您将在循环内测试的变量

接下来循环计算i < 10 表达式。这将返回一个布尔值，该值将在前 10 次运行时为真。当这个表达式一直评估为真时，循环内的代码就会运行。

document.write("This is number " + i);

每次运行此代码后，都会执行循环i++ 的最后一部分。此示例中的此代码在每次执行后将 1 添加到 i。

执行该代码后，检查循环条件，重复步骤 2 和 3，直到最终条件为假，在这种情况下退出循环。

这就是循环在您提到的语言中的工作方式。

【讨论】：

你是对的，但为什么 OP 应该比他们引用的网站更信任你？我不想贬低您的答案，但您只是在重复 OP 已经相信知道的内容。

我觉得我在用不同的方式解释他所知道的。他对我的解释的解释应该与他已经相信的相符。

@FelixKling 可能是因为 SO 有投票系统，因此 SO 有一种同行评审形式，并且答案已被投票通过。也许 OP 不应该比引用的网站更信任 SO。但这质疑为什么 OP 首先会在这里提出这个问题。 :)

【参考方案2】：

让我们看看corresponding section in the ECMAScript specification：

生产IterationStatement : for ( var VariableDeclarationListNoIn ; 表达式_opt; 表达_opt)声明 评估如下：

1. Evaluate VariableDeclarationListNoIn.
2. Let V = empty.
3. Repeat
  a. If the first Expression is present, then
     i. Let testExprRef be the result of evaluating the first Expression.
     ii. If ToBoolean(GetValue(testExprRef)) is false, 
         return (normal, V, empty).
  b. Let stmt be the result of evaluating Statement.
  ...
  f. If the second Expression is present, then
     i. Let incExprRef be the result of evaluating the second Expression.
     ii. Call GetValue(incExprRef). (This value is not used.)

如您所见，在第 1 步中，对变量赋值进行了评估。在步骤 3a 中，测试条件。在步骤 3b 中，循环体被求值，之后第三个​​表达式在步骤 3f 中被求值。

因此你对for循环的理解是正确的。

---

假设它在其他语言中的工作方式相同，因为for 循环在编程语言中是如此常见的语句（请注意，Python 没有这样的语句）。但如果你想绝对确定，最好也参考他们的规范。

【讨论】：

@Felix Kling - 我不介意参考规范，但解释往往超出了像我这样的新手所能理解的范围。除非像你这样的人会解释它，否则我永远不会理解你引用的参考文献。

@PeanutsMonkey：是的，我能理解。但是IMO只有不时看一下才能开始理解它。它会更好的。我花了很长时间才理解它，有些部分仍然很难。

@Felix Kling - 我可以安全地假设同样的原则可以应用于其他语言吗？

@FelixKling。我决定为具有相同id 重复问题的多个元素写一个full answer。这个问题每天都在这里问几次。你觉得可以改进吗？如果你这样做，我会把它做成一个社区维基。

【参考方案3】：

您引用的来源是错误的，我们可以证明它......

for 循环的基础有四个可以执行的独立块：

for(initialise;condition;finishediteration)iteration

幸运的是，我们可以在每个块中执行一个函数。因此，我们可以创建四个函数，它们在执行时会记录到控制台：

var initialise = function ()  console.log("initialising"); i=0; 
var condition = function ()  console.log("conditioning"); return i<5; 
var finishediteration = function ()  console.log("finished an iteration"); i++; 
var doingiteration = function ()  console.log("doing iteration when `i` is equal", i); 

然后我们可以运行以下命令，将上述函数放入每个块中：

for (initialise(); condition(); finishediteration()) 
    doingiteration();

卡布姆。有效。

如果您在 Mac 上使用 Safari 查看此页面，则可以 AppleAlt + I 并复制上述两个 sn -ps，依次进入控制台查看结果。

编辑，额外信息....

另外...完成的迭代块是可选的。例如：

for (var i=0; i<10;)  
    console.log(i); i++; 
;

确实有效。

【讨论】：

不知道我可以调用你举例说明的函数。

您介意详细说明每个函数被调用到for loop 吗？例如，您有var initialise = function () console.log("initialising"); i=0; 。这是否意味着initialise() 具有console.log("initialising"); i=0; 的值？

@PeanutsMonkey 我不确定你的问题，但我会尝试回答。 javascript中的函数是变量，因此可以像其他东西一样存储并稍后调用。因此这个function initialise () some code 与var initialise = function () some code 相同。由于这对后来的一些 JavaScript 概念非常关键，您可能会或可能不会越过，我相信像上面那样编写函数是一个好习惯。

@PeanutsMonkey 所以...当变量initialise 被告知使用() 运算符执行时，它将触发initialise 的 之间的代码块。因此，当浏览器到达initialise() 时，它会执行console.log("initialising"); i=0;

【参考方案4】：

第二个参考是错误的。你的解释是正确的。

【参考方案5】：

另一种思考方式，如果这对您有帮助：

var i = 0;
while (i < 10) 
    document.write("This is number " + i);
    i++;

【讨论】：

好的。作为初学者，我认为当您大声朗读它时，最初它比 for 循环更有意义，主要是因为一切都井井有条。

我没有接触过 while 循环，但它确实向我介绍了另一种处理它的方法

【参考方案6】：

这是for 语句语法：

for(initalize, condition, increment) 
    Do_some_things();

initalize 只会在for 开始时执行一次，然后执行Do_some_things(); 语句，而condition 仍然是true，它将执行increment 然后Do_some_things();。如果 co condition false，for 将退出。

for (var i=0; i < 10; i=i+1) 
    document.write("This is number " + i);

var i=0 将执行一次（初始化）。 i < 10 条件总是在循环后检查。 i=i+1 将在检查 i < 10 后执行，结果为真。 i的值为：0、1、3、4、5、6、7、8、9（10次循环）

【讨论】：

执行块之前测试“条件”（第二个表达式）。如果条件最初为假，则不会执行该块。 “增量”（第三个表达式）总是在块完成之后和再次测试条件之前执行。请注意，“条件”和“增量”可以是任何有效的表达式，但第二个必须为真才能执行块。