Question

我目前正在尝试在javascript中创建一个数独网格，要做到这一点，我需要设置一个循环，这样一行重新出现10次，每次之间的间隔为20像素。到目前为止，我有：

var canvas;
canvas = openGraphics();

var x;
var y;
var gap;
x = 20;
y = 20;
gap = 25;

canvas.drawLine(20, 20, 20, 245);

canvas.paint();

你会怎么建议这样做？

Answer 1

正如您已经说过的，您必须使用循环结构。

Mozilla开发者网络在这些方面有很好的documentation。

但老实说，我认为你应该在尝试编写游戏之前阅读他们的JavaScript Guide，否则你最终会陷入大量的死胡同，你很快就会失去对游戏的兴趣。所有

此外，请在搜索JavaScript帮助时留在MDN，因为互联网上有很多网站都有坏的，旧的，破损的代码示例和帮助。

特别是从w3schools 远离。

Answer 2

程序员可以使用各种循环结构，其中最常见的2个是for loop和while loop。

for循环适用于“循环”多次，while循环用于循环，而某些值为“true”。

在这种情况下，您知道需要绘制的行数，因此for循环最匹配

这是for循环的示例代码。会发生什么是{和}之间的代码多次运行。每次循环运行时，变量i从0开始变大1.这一直持续到条件 i＆lt; numberTimesToLoop 变为假。

for(var i=0;i<numberTimesToLoop;i++)
{
    document.write("i = " + i);
    document.write("<br />");
}

并非我想为您完成任务，但在很多情况下，通过查看实际代码更容易学习。（我证明并且我发现很多看到答案的学生可以在将来立即认出它。当然我先给他们理论，如果没有点击我尝试这种方法......）

对当前代码的这种修改将绘制垂直线。

var canvas;
canvas = openGraphics();

var x;
var y;
var gap;
x = 20;
y = 20;
gap = 25;


var currentX = 20;
for(var i=0;i<10;i++)
{
    canvas.drawLine(currentX, 20, currentX, 245);
    currentX = currentX + gap;
}
canvas.paint();

（不确定w3schools网站的问题是什么）

如何循环drawLine使其重复10次

2 个答案: