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

时间:2014-05-28 11:30:44

标签: javascript for-loop var

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。

请帮助我理解。

由于

2 个答案:

答案 0 :(得分:12)

问题在于你的迭代器(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==65来自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();

但是,第二个选项是个坏主意,因为它会将ij放在全局范围内,这就是要求冲突。我建议使用var选项。

答案 1 :(得分:6)

如果你像

那样写你的循环
for (i = 0; i < 5; i++)

此处i是指一个全局变量,因为您尚未使用var关键字声明它,并且由于您在两个函数中都使用i,因此它们最终实际使用相同的变量

然后你应该用

替换两个循环
function f1() {
   for (var i = 0; i <= 5; i++)
      console.log(i);
}
function foo() {
   for (var i = 0; i < 5; i++)
      f1();
}
foo();

由于您的代码最初是编写的,i是一个共享的全局变量,因此foo启动,设置为0然后调用f1,它循环到6 },当控件返回foo时,它发现i6,因此i < 5false,因此它会结束循环。