Javascript 生命虫游戏

我正在用P5JS编写康威生活游戏，但我有一个wierd bug。这似乎“有效”，但看起来完全错了。我不确定它是否与查找邻居无关，因为当我手动调用该函数时，它可以工作。我甚至在那里复制了互联网的第二邻居计数功能，它也能工作

也许这是一个视觉故障，但我也不确定，因为代码看起来很好

/// <reference path="../TSDef/p5.global-mode.d.ts" />

let gridSize = 10;
let arrCurrent = create2dArray(gridSize);
let arrNext = create2dArray(gridSize);

function setup() {
  createCanvas(800, 800, WEBGL);
  background(0);
  stroke(0, 255, 0);
  noFill();

  initGame();
}

function draw() {

  displayCells();
  calcNextGen();
}

//Returns a 2D Array 
function create2dArray(size) {
  let newArray = new Array(size);
  for (let i = 0; i < newArray.length; i++) {
    newArray[i] = new Array(1);
  }
  return newArray;
}

//Fills initial array with random values
function initGame() {
  for (let x = 0; x < arrCurrent.length; x++) {
    for (let y = 0; y < arrCurrent.length; y++) {
      arrCurrent[x][y] = Math.round((Math.random()));
    }
  }
}

//Calculates next generation
function calcNextGen() {

  for (let x = 0; x < gridSize; x++) {
    for (let y = 0; y < gridSize; y++) {
      let neighbors = countNeighbors1(arrCurrent, x, y);
      let state = arrCurrent[x][y];

      //If cell is dead and has exactly 3 neighbors, it starts living
      if (state === 0 && neighbors === 3) {
        arrNext[x][y] = 1;
      }
      //If cell lives and has too few or too many neighbors, it dies
      else if (state === 1 && (neighbors < 2 || neighbors > 3)) {
        arrNext[x][y] = 0;
      }
      else {
        arrNext[x][y] = state;
      }

    }
  }
  arrCurrent = arrNext.slice();
}

//Count neighbors
function countNeighbors(x, y) {
  return arrCurrent[(x + 1) % gridSize][y] +
    arrCurrent[x][(y + 1) % gridSize] +
    arrCurrent[(x + gridSize - 1) % gridSize][y] +
    arrCurrent[x][(y + gridSize - 1) % gridSize] +
    arrCurrent[(x + 1) % gridSize][(y + 1) % gridSize] +
    arrCurrent[(x + gridSize - 1) % gridSize][(y + 1) % gridSize] +
    arrCurrent[(x + gridSize - 1) % gridSize][(y + gridSize - 1) % gridSize] +
    arrCurrent[(x + 1) % gridSize][(y + gridSize - 1) % gridSize];
}


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

function displayCells() {
  background(0);

  translate(-300, -300, 0);
  for (let x = 0; x < arrCurrent.length; x++) {
    for (let y = 0; y < arrCurrent.length; y++) {
      push();
      translate(x * 50, y * 50, 0);
      if (arrCurrent[x][y] === 1) box(50);
      pop();
    }
  }
}

function logGrid() {
  console.log(arrCurrent[0]);
  console.log(arrCurrent[1]);
  console.log(arrCurrent[2]);
  console.log(arrCurrent[3]);
  console.log(arrCurrent[4]);
  console.log(arrCurrent[5]);
  console.log(arrCurrent[6]);
  console.log(arrCurrent[7]);
  console.log(arrCurrent[8]);
  console.log(arrCurrent[9]);
}

//
让gridSize=10；
设arrCurrent=create2dArray（gridSize）；
设arrNext=create2dArray（gridSize）；
函数设置（）{
createCanvas（800800，WEBGL）；
背景（0）；
笔划（0,255,0）；
noFill（）；
initGame（）；
}
函数绘图（）{
显示单元格（）；
calcNextGen（）；
}
//返回二维数组
函数create2dArray（大小）{
设newArray=新数组（大小）；
for（设i=0；i3））{
arrNext[x][y]=0；
}
否则{
arrNext[x][y]=状态；
}
}
}
arrCurrent=arrNext.slice（）；
}
//数一数邻居
函数（x，y）{
返回当前值[（x+1）%gridSize][y]+
arrCurrent[x][（y+1）%gridSize]+
arrCurrent[（x+gridSize-1）%gridSize][y]+
arrCurrent[x][（y+gridSize-1）%gridSize]+
当前[（x+1）%gridSize][（y+1）%gridSize]+
当前[（x+gridSize-1）%gridSize][（y+1）%gridSize]+
当前[（x+gridSize-1）%gridSize][（y+gridSize-1）%gridSize]+
当前[（x+1）%gridSize][（y+gridSize-1）%gridSize]；
}
函数countNeighbors1（网格，x，y）{
设和=0；
for（设i=-1；i<2；i++）{
for（设j=-1；j<2；j++）{
设col=（x+i+gridSize）%gridSize；
设行=（y+j+gridSize）%gridSize；
总和+=网格[列][行]；
}
}
总和-=网格[x][y]；
回报金额；
}
函数displayCells（）{
背景（0）；
翻译（-300，-300，0）；
for（设x=0；x

我知道我已经很接近了，但两个小时后我就开始用头撞这个了

这里有一点，您可以复制代码，并直观地看到问题

---

感谢您的帮助，谢谢

arrCurrent=arrNext.slice（）不创建网格的深度副本，它只创建第一个维度的浅副本。
它创建一个网格，其中
arrCurrent
列指
arrNext
的行

您必须创建一个全新的网格：

arrCurrent=[]
for（设x=0；x


让gridSize=10；
设arrCurrent=create2dArray（gridSize）；
设arrNext=create2dArray（gridSize）；
函数设置（）{
createCanvas（800800，WEBGL）；
背景（0）；
笔划（0,255,0）；
noFill（）；
initGame（）；
帧率（10）
}
函数绘图（）{
显示单元格（）；
calcNextGen（）；
}
//返回二维数组
函数create2dArray（大小）{
设newArray=新数组（大小）；
for（设i=0；i3））{
arrNext[x][y]=0；
}
否则{
arrNext[x][y]=状态；
}
}
}
arrCurrent=[]
for（设x=0；x