Question

我正在创建一个在画布上显示随机点的程序，但是当我给出规则指定哪些点应该保持点亮时，我遇到了问题。我创建了一个带有匹配数组的画布，因此对于X个像素，在2D数组中存在一个对象。该数组创建如下：

<code>
//create array
ctx.grid = []
for (var i = 0; i < canvasSize; i++) {    
ctx.grid.push([]);
for (var e = 0; e < canvasSize; e++) {
ctx.grid[i].push({light:false, clean:true})
}
}

</code>

游戏循环开始创建一个从0到canvasSize * canvasSize的随机数然后设置一个divicion来过滤这个数字，并在我的数组ctx.grid上得到一个确切的位置，并将light属性设置为true。以下循环查找数组中属性灯设置为true的所有对象，并通过调用drawPoint（）函数在画布上绘制一个正方形。

<code>

setInterval(gameLoop,10);

function gameLoop() {
    //Get a random number from 0 to canvasSize
    var light = Math.floor(Math.random()*(canvasSize*canvasSize));
    var row = parseInt(light/canvasSize);
    var col = light%canvasSize;
    ctx.grid[row][col].light = true;

    //Find which points need to be drawn
    for (var i = 0; i < ctx.grid.length; i++) {
        for (var e = 0; e < ctx.grid[i].length; e++) {
            if (ctx.grid[i][e].light) {

                drawPoint(i,e);
                findCorner(i,e);
                clearPoint(i,e);                                                        


                 }
            }
        }
    }

  </code>

我没有包含所有程序的代码，因为它们对解决这个问题并不重要。接下来是由findCorner（）指定的一组规则的开头，它告诉程序何时应该在画布上保留一些特定点。

<code>
  function findCorner(y,x) {
 //Avoid corners
  if (y != 0 || x != 0 || y != canvasSize || x != canvasSize) { 

    if (ctx.grid[y-1][x].light) { //Cannot read property '9' of undefined 
      //another set of rules
       }
    // console.log(ctx.grid);
    // console.log(y);
    // console.log(x);
    // console.log(ctx.grid[y-1][x]);

</code>

当我在没有findCorners（）函数的情况下运行程序时，它运行顺利意味着我的数组设置得很好，但是if语句会给我带来问题。在开发人员工具上，我收到以下错误：

无法阅读财产＆＃39; 9＆＃39;未定义的

这出现在我对我的代码发表评论的行上，以及＆＃39;数字＆＃39;永远不同。

我在我的代码上添加了最后一个控制台日志，因为当我使用这些行运行我的程序时，程序运行得非常奇怪，程序运行时没有任何错误，尽管它运行速度非常慢并且使我的浏览器在一段时间后崩溃。

Answer 1

事实证明我的其他评论错了。

未检测到边缘导致您索引到数组的未设置部分，从而导致这些奇怪的消息并且是您的所有问题

我把它缩了一下看看它

请参阅https://jsfiddle.net/goujdwog/2/

从中获得重要的是在findCorners()开始时修复支票：
if (y > 0 && x > 0 && y < canvasSize -1 && x < canvasSize -1)

在游戏圈

1 个答案: