Question

var
startx = 0,
starty = 0,
endx = 12,
endy = 100;

for(startx;startx <= endx; startx+=1){
        for(starty; starty <= endy; starty+=1){
            console.log(startx, endx, starty, endy);
     }
}

预期产出：

0, 12, 0, 100
0, 12, 1, 100
0, 12, 2, 100
...
0, 12, 100, 100
1, 12, 0, 100
1, 12, 1, 100
...
12, 12, 100, 100
;EOO

Chrome 39 +上的输出

0, 12, 0, 100
0, 12, 1, 100
0, 12, 2, 100
...
0, 12, 100, 100

所以问题是第一个for循环不会遍历startx变量。

你能告诉我它为什么不迭代吗？

Answer 1

这是一个有趣的谜题。在我抓住它之前我花了几次。

原因是starty在第一次迭代后没有重置，因此第二次for循环只运行一次，因为条件总是为假。

你想：

var startx = 0,
    starty = 0,
    endx = 12,
    endy = 100;

for (; startx <= endx; startx++) {
    for (starty = 0; starty <= endy; starty++) {
        console.log(startx, endx, starty, endy);
    }
}

我还将startx+=1简化为startx++，同样适用于starty。

我还建议养成每个var声明的习惯：

var a;
var b;

这使得在调试时更容易停止。尝试步入def()而不进入abc()。

var a = abc(),
    b = def();

for循环如何分解：

for循环分为3部分：

for(initial; condition; after)

在循环之前调用

initial，可以安全地省略在循环中运行代码之前调用condition，如果省略则始终为true 在循环中的代码与写入相同之后调用after：

for(var i = 0; i < 10;) {
  // code
  i++;
}

Answer 2

var startx = 0,
starty = 0, 
endx = 12, 
endy = 100; 
for(startx;startx <= endx; startx++){
  for(starty; starty <= endy; starty++){ 
   console.log(startx, endx, starty, endy); 
 } }

此处您的第二个for loop执行 100次，因为您的条件为starty <= endy且 endy将值100设为。当startx为0时。在完成第二个for循环的执行之后，startx增量为1并且再次处理继续，直到它获得值12。浏览器显示完整的结果，您可以控制它并向下滚动。你会得到你想要的出局。希望它对你有用。

JavaScript中的双循环

2 个答案: