javascript - 为什么这个 javascript for 循环只运行一次？

Question

function f1() {
   for (i = 0; i <= 5; i++)
      console.log(i);
}
function foo() {
   for (i = 0; i < 5; i++)
      f1();
}
foo();

您好，我想了解为什么执行 foo 的结果是:

0
1
2
3
4
5

而不是:

0
1
2
3
4
5
0
1
2
3
4
5
0
1
2
3
4
5
0
1
2
3
4
5
0
1
2
3
4
5

这是我正在阅读的一张关于 JS 的幻灯片，它谈到当你不使用 var 时，它是在全局对象上定义的，并提供了这个例子，但没有任何进一步的细节，为什么我们得到结果。

我认为它会简单地循环并每次运行 f1 函数，直到它小于 5。

请帮助我理解。

谢谢

Answer 1

问题出在您的迭代器 ( i ) 中:

for (i = 0; i <= 5; i++)

i是全局性的，你的for循环测试它，使它们只运行一次，并在 i == 5 时中止.

那么，发生的事情是这样的:

当您调用 foo() 时, foo告诉 js 解释器在全局范围内创建一个名为 i 的变量, 并将其设置为 0 .然后 foo电话 f1 .
在那里，for循环集 i ，已经存在，到0 , 并像它应该的那样运行它的循环，递增 i最多 5 .
然后，是时候在 foo 中进行第二次循环迭代了。 , 所以它检查是否 i < 5 , 但它不是 ( i==6 ( 5 来自 f1 , +1 来自 foo )), 所以它不会调用 f1再次。

要解决此问题，请使用 var 在函数的局部范围内声明它们:

function f1() {
    for (var i = 0; i <= 5; i++)
        console.log(i);
}
function foo() {
    for (var i = 0; i < 5; i++)
        f1();
}
foo();

或者，使用不同的变量:

function f1() {
    for (i = 0; i <= 5; i++)
        console.log(i);
}
function foo() {
    for (j = 0; j < 5; j++)
        f1();
}
foo();

但是，第二个选项不是个好主意，因为它会同时放置 i和 j在全局范围内，这是要求冲突。我建议使用 var选项。