P5.js 中的生命游戏

Question

好的，所以我尝试在 p5.js 中制作康威的人生游戏，但我遇到了一些奇怪的错误。

function make2DArray(cols, rows) {
     let arr = new Array(cols);
    for (let i = 0; i < arr.length; i++) {
        arr[i] = new Array(rows);
    }
    return arr;
 }

function countNeighbors(grid, x, y) {
    let sum = 0;
    for (let i = -1; i < 2; i++) {
        for (let j = -1; j < 2; j++) {
            let col = x + i;
            let row = y + i;
            if (grid[col][row] === undefined){
        sum += grid[col][row];
      }
    }
    }
  sum-=grid[x][y]
    return sum;
}

let grid;
let next;
let cols;
let rows;
let resolution = 20;
let fr = 15;

function setup() {
    createCanvas(600, 400);
    frameRate(fr);
    cols = width / resolution;
    rows = height / resolution;

    next = make2DArray(cols, rows);
    grid = make2DArray(cols, rows);
    for (let i = 0; i < cols; i++) {
        for (let j = 0; j < rows; j++) {
            grid[i][j] = floor(random(2));
        }
    }
}

function draw() {
    background(0);
    for (let i = 0; i < cols; i++) {
        for (let j = 0; j < rows; j++) {
            let x = i * resolution;
            let y = j * resolution;
            if (grid[i][j] == 1) {
                fill(0);
                stroke(150);
                rect(x, y, resolution - 1, resolution - 1);
            } else {
                fill(255);
                stroke(150);
                rect(x, y, resolution - 1, resolution - 1);
            }
        }   
    }   
    for (let i = 0; i < cols; i++) {
        for (let j = 0; j < rows; j++) {
            let state = grid[i][j];
            let neighbors = countNeighbors(grid, i, j);
            if (state == 0 && neighbors == 3) {
                next[i][j] = 1;
            } else if (state == 1 && (neighbors < 2 || neighbors > 3)) {
                next[i][j] = 0;
            } else {
                next[i][j] = state;
            }                   
        }
    }
    grid = next;
}

基本上我有函数 countNeighbors，我认为那里有错误，我尝试检查 col 和 row 是否是数组的边界像这样

if (col>-1 && col <grid.length && row>-1 && row < grid[0].length){
     //increase sum 
}

但情况更糟。我是 js 的新手，所以我发现如果

let x=new Array(10);
 //and then when i try this
 console.log(c[-1])
 //it should give undefined

但程序仍然无法运行:( 谢谢！

Answer 1

通过一些更改，您可以使其工作：

1) 将 let row = y + i; 替换为 let row = y + j; 打字错误导致大部分计数无效。

2) 替换条件

if (grid[col][row] === undefined){

来自

if (0 <= col && col < cols && 0 <= row && row < rows){

您的原始条件的问题是，如果 grid[col] 未定义，则 grid[col][row] 是 undefined[row]，这没有意义。

3) 为了一致性起见，在sum-=grid[x][y]

末尾加一个分号

4) 最后，为了不创建意外的别名，您需要将 grid = next 替换为：

for(let i = 0; i < grid.length; i++){
      grid[i] = next[i].slice();
    }

或者，使 next 成为 draw() 的局部变量，并将行 let next = make2DArray(cols, rows); 放在 draw().

的开头

P5.js 中的生命游戏

Game of Life in P5.js

javascript

multidimensional-array

undefined

p5.js

conways-game-of-life