生命游戏“细胞”没有正确更新

Question

So i am trying to code conway's game of life in javaScript but something isn't working. If i but three cells in a row they should just flip directions but instead it makes a 2 by 2 square. I looked around and found that you need to wait to update position until the whole "board" is scanned. But i atleast think I'm already doing that. So I genuinely have no clue what is wrong.

I call the uppdateGridValues function to run a generation

 function getCellValue(row, col) { try { return arry[row][col]; } catch (e) { return 0; } } function countNeighbours(row, col) { let neighbours = 0; neighbours += getCellValue(parseInt(row - 1), parseInt(col - 1)); neighbours += getCellValue(parseInt(row - 1), parseInt(col)); neighbours += getCellValue(parseInt(row - 1), parseInt(col + 1)); neighbours += getCellValue(parseInt(row), parseInt(col - 1)); neighbours += getCellValue(parseInt(row), parseInt(col + 1)); neighbours += getCellValue(parseInt(row + 1), parseInt(col - 1)); neighbours += getCellValue(parseInt(row + 1), parseInt(col)); neighbours += getCellValue(parseInt(row + 1), parseInt(col + 1)); return neighbours; } function uppdateCell(i, j) { const total = countNeighbours(i, j); if (arry[i][j] === 0 && total == 3) { return 1; } else if (total > 4 || total < 3) { return 0; } else { return arry[i][j]; } } function uppdateGridValues() { for (var i = 0; i < cellsInRow; i++) { for (var j = 0; j < cellsInCollum; j++) { let newState = uppdateCell(i, j); arryOld[i][j] = newState; } } arry = arryOld; arryOld = arry; }

Create Array

let arry = [];
let arryOld = [];

for(var i = 0; i < cellsInRow; i++){
    
    arry[i] = [];
    
    for(var j = 0; j < cellsInCollum; j++){
        
        arry[i][j] = 0;
    }
}

arryOld = arry;

I do sometimes get NaN when writing out the total variable in the uppdateCell function. I don't know why because i am suppose to return a 0 if the value passed to getCellValue from countNeighbours is outside the array size.

Answer 1

You can't use try/catch to detect reading outside the array. Access outside the array just returns undefined , it doesn't raise an exception.

You can use || to return a default if the value isn't set (note that this works in this particular case because there are no other "falsey" values that are valid to return, it can't always be used like this).

function getCellValue(row, col) {
  return arry[row][col] || 0;
}

Another problem is that

arryOld = arry;

doesn't make a copy of the array, both variables refer to the same array. Use this to make a deep copy of the array.

arryOld = arry.map(row => [...row]);

Answer 2

My guess at the issue

I'm reading through, and I've found something which may be causing the error: your calls of parseInt() in countNeighbors() .

From the MDN JavaScript Docs on parseInt() :

"The parseInt() function parses a string argument and returns an integer... or NaN . (if the input is invalid in a few different ways)"

Basically, parseInt() is expecting string input and youre giving it integer input. I'd reccomend removing the calls to parseInt() from countNeighbors() like this:

function countNeighbours(row, col) {
  let neighbours = 0;

  neighbours += getCellValue((row - 1), (col - 1));
  neighbours += getCellValue((row - 1), (col));
  neighbours += getCellValue((row - 1), (col + 1));

  neighbours += getCellValue((row), (col - 1));
  neighbours += getCellValue((row), (col + 1));

  neighbours += getCellValue((row + 1), (col - 1));
  neighbours += getCellValue((row + 1), (col));
  neighbours += getCellValue((row + 1), (col + 1));

  return neighbours;
} 

Some other suggestions

While I was reading thru this code, I thought of a few suggestions on things you might be able to do it. (These are totally optional tho. None of these things could be causing your code to break.)

1. arry as a global variable here works, but global variables make code harder to manage and understand. I would make this a local variable of a main function, and pass it into all of your other functions.
2. arry should be renamed to something more descriptive; possibly gameboard or grid .
3. countNeighbors() can be shortened and simplified using a nested for, similar to what you have in updateGridValues() . Here's an example of how that could be done:

function countNeighbours(row, col) {
  let neighbourTotal = 0;
  for (let y = -1; y <= 1; y++) {
    for (let x = -1; x <= 1; x++) {
      neighbourTotal += getCellValue(row + y, col + x);
    }
  }
 
  return neighbourTotal;
}