javascript 中未定义矩阵变量

Question

我正在使用回溯算法和 p5.js 库编写迷宫生成器，但是当我编写循环以在迷宫中设置随机位置时，我注意到 javascript 中的一个错误： “maze[(x - 2)] 未定义”，但是这个变量被声明了！我试图阅读有关数据结构的内容，但找不到解决此问题的方法。

发生了什么事？

有人可以帮助我吗？

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset = "utf-8">
      <title>Maze</title>
  </head>
  <body>
  <script src = "https://cdn.jsdelivr.net/npm/p5@1.4.0/lib/p5.js"></script>
<script>

var width = 720;
var height = 400;
var x, y;
var maze = Array(39).fill(Array(71).fill(0));

function setup()
{
  createCanvas(720, 400);
}

function draw()
{
  //inicial position
  x = 1;
  y = 1;
  maze[x][y] = 1;
  //grid
  strokeWeight(1);
  stroke('BLACK');
  for (x = 0; x <= 720; x += 10) line(x, 0, x, 400);
  for (y = 0; y <= 400; y += 10) line(0, y, 720, y);

  found = 0;
  do
  {
    direction = Math.floor(Math.random() * 4);
    if (direction == 0 && (y != width - 2 && maze[x][y + 2] == 0))
    {
      x2 = x;
      y2 = y;
      y += 2;
      maze[x][y] = 1;
      maze[x][y-1] = 1;
      found = 1;
    }
      else if (direction == 1 && (x > 1 && maze[x - 2][y] == 0))
      {
        x2 = x;
        y2 = y;
        x -= 2;
        maze[x][y] = 1;
        maze[x + 1][y] = 1;
        found = 1;
      }
        else if (direction == 2 && (y > 1 && maze[x][y - 2] == 0))
        {
          x2 = x;
          y2 = y;
          y -= 2;
          maze[x][y] = 1;
          maze[x][y + 1] = 1;
          found = 1;
        }
      else if (direction == 3 && (x != height - 2 && maze[x + 2][y] == 0))
      {
        x2 = x;
        y2 = y;
        x += 2;
        maze[x][y] = 1;
        maze[x - 1][y] = 1;
        found = 1;
      }
  } while (found == 0);
  noLoop();
}
</script>
</body>
</html>

Answer 1

此代码存在一些问题。

让我们从您收到该错误的原因开始。问题是您在绘制线条的 for 循环中重复使用全局 x 和 y 变量，循环完成后，它会将这些变量设置为大于 maze 数组.

这给我们带来了第二个问题：maze 数组小于 canvas 的 width/height。

代码不是 100% 工作所以我不完全明白它应该做什么，但似乎 x 和 y 不应该超过 width/height，但是你有一个条件 y != width - 2 即使 y 大于 width 也是如此（顺便说一句，它不应该是 height 吗？？）

最后，在整个代码中，您有多个地方使用 720 和 400，而不是使用 width 和 height 变量。这是一种不好的做法。

const width = 720;
const height = 400;
var x, y;
var maze = Array(width+1).fill(Array(height+1).fill(0));
function setup()
{
  createCanvas(width, height);
}

function draw()
{
  //inicial position
  x = 1;
  y = 1;
  maze[x][y] = 1;
  //grid
  strokeWeight(1);
  stroke('BLACK');
  for (let x = 0; x <= width; x += 10) line(x, 0, x, height);
  for (let y = 0; y <= height; y += 10) line(0, y, width, y);

  found = 0;
  do
  {
    direction = Math.floor(Math.random() * 4);
    if (direction == 0 && (y <= height - 2 && maze[x][y + 2] == 0))
    {
      x2 = x;
      y2 = y;
      y += 2;
      maze[x][y] = 1;
      maze[x][y-1] = 1;
      found = 1;
    }
      else if (direction == 1 && (x > 1 && maze[x - 2][y] == 0))
      {
        x2 = x;
        y2 = y;
        x -= 2;
        maze[x][y] = 1;
        maze[x + 1][y] = 1;
        found = 1;
      }
        else if (direction == 2 && (y > 1 && maze[x][y - 2] == 0))
        {
          x2 = x;
          y2 = y;
          y -= 2;
          maze[x][y] = 1;
          maze[x][y + 1] = 1;
          found = 1;
        }
      else if (direction == 3 && (x <= width - 2 && maze[x + 2][y] == 0))
      {
        x2 = x;
        y2 = y;
        x += 2;
        maze[x][y] = 1;
        maze[x - 1][y] = 1;
        found = 1;
      }
  } while (found == 0);
  noLoop();
}

<script src = "https://cdn.jsdelivr.net/npm/p5@1.4.0/lib/p5.js"></script>

javascript 中未定义矩阵变量

Matrix variable is not undefined in javascript

javascript

undefined