这个for循环如何制作一个8x8的板

How this for loop makes a 8x8 board?

本文关键字：一个 8x8 的板 for 循环 何制作 这个      更新时间：2023-09-26
var size = 8;
var board = "";
for (var y = 0; y < size; y++) {
  for (var x = 0; x < size; x++) {
    if ((x + y) % 2 == 0)
      board += " ";
    else
      board += "#";
  }
  board += "'n";
}
console.log(board);

现在我明白这创建了一个8x8的板。我有问题在理解如何和什么是第二个"for"循环做(我想了解它的行为)。据我所知，这两个循环创建了一个二维坐标系，第一个循环覆盖y轴，第二个覆盖x轴。我明白下面的代码块是如何工作的。

{
 if ((x + y) % 2 == 0)
    board += " ";
 else
    board += "#";
}

我不明白第二个for循环如何覆盖x轴。我开始阅读雄辩的javascript，这个问题是作为一个练习。它提供了一个关于嵌套循环的简短信息，但没有这么复杂。我搜索了以前的答案，但没有得到关于这个的信息。任何帮助吗?

"观察"变量的变化可以让您更好地了解程序是如何工作的:

var prog= [],
    table= document.querySelector('table'),
    sx= document.getElementById('x'),
    sy= document.getElementById('y'),
    smod= document.getElementById('mod');
function display(x, y, c) {
  prog.push([x,y,c]);
}
function runProgram() {
  var p= prog.shift();
  if(p) {
    var x= p[0], y= p[1], c= p[2], mod= (x+y) % 2;
    sx.innerHTML= x;
    sy.innerHTML= y;
    smod.innerHTML= mod;
    table.rows[y].cells[x].innerHTML= c;
    setTimeout(runProgram, 200);
  }
}
var size = 8;
var board = "";
for (var y = 0; y < size; y++) {
  for (var x = 0; x < size; x++) {
    if ((x + y) % 2 == 0) {
      board += " ";
      display(x, y, ' ');
    }
    else {
      board += "#";
      display(x, y, '#');
    }
  }
  board += "'n";
}
console.log(board);
runProgram();
th {
  height: 20px;
  width: 20px;
  border: 1px solid gray;
}
y= <span id="y"></span><br>
x= <span id="x"></span><br>
(x+y) % 2 = <span id="mod"></span>
<table>
  <tr><th><th><th><th><th><th><th><th></tr>
  <tr><th><th><th><th><th><th><th><th></tr>
  <tr><th><th><th><th><th><th><th><th></tr>
  <tr><th><th><th><th><th><th><th><th></tr>
  <tr><th><th><th><th><th><th><th><th></tr>
  <tr><th><th><th><th><th><th><th><th></tr>
  <tr><th><th><th><th><th><th><th><th></tr>
  <tr><th><th><th><th><th><th><th><th></tr>
</table>

基本的编程知识告诉我们，for循环只是一种将变量的值调整一定次数的方法。在你的例子中，你基本上是从0开始"计数"，并增加y，直到它大于size。

所以第二个"嵌套的"for循环基本上采用了这个非常简单的概念并对其进行了扩展。所以对于每一个y，外循环的x将从0开始迭代到size-1。

考虑以下修改后的代码示例:

for (var y = 0; y < size; y++) {
    for (var x = 0; x < size; x++) {
        board += " " + (size * y + x);
    }
    board += "'n";
}

产生如下输出:

0 1 2 3 4 5 6 7
8 9 10 11 12 13 14 15
16 17 18 19 20 21 22 23
24 25 26 27 28 29 30 31
32 33 34 35 36 37 38 39
40 41 42 43 44 45 46 47
48 49 50 51 52 53 54 55
56 57 58 59 60 61 62 63

这样，变量x和y似乎被恰当地命名了。对于每一行y, x将从0变为size-1。

希望这是有意义的!

考虑这个真值表，它显示了两个整数相加的偶数/奇数结果:

|  X is even  |  Y is even  | X + Y is even | Write a space?
|     F       |      F      |      T        |      T 
|     T       |      F      |      F        |      F
|     F       |      T      |      F        |      F
|     T       |      T      |      T        |      T

所以从位置(0,0)开始，内循环会写一个空格。考虑下一行(0,1)-内部循环将写一个数字符号，因为1 + 0的结果是奇数。无论当前的行或列如何，这种模式在整个棋盘上继续。

因此，你也可以判断任意棋盘上的任何正方形是空的还是有数字符号。

相关文章：