Question

This is my first attempt at using classes in a Javascript project – I’m trying to implement Conway’s Game of Life in HTML5 Canvas. Here’s the code. As you can see, the first generation renders fine, but there’s something wrong with the next() function that prevents it from running any further. (I did notice that the error in question is actually being thrown at the last line of get(), one of the functions called by neighbors(), which is called by next(). I can’t find any problems in either function, but clearly something’s wrong!)

Answer 1

The problem is [that the assumption about % is wrong and thus] the guards in the get/set functions do not work as intended:

-1 % 42 // results in -1

Happy coding.

---

I would consider removing the guards in the get/set functions and using sentinel values (or other neighbor edge-casing) for the border (e.g. the first/last row and column are never actually drawn to the screen).

This can avoid a significant number of guard checks — get/set will be called a whole bunch of times each iterations (I wouldn’t even have them as functions). I consider the removal of get/set and guards “okay” because these operations are internal to the process and closely tied to the algorithm — they are not directly exposed and JavaScript is only so fast.

Doing a “full grid neighbor check” is C * O(h*w) per cycle. While it has the same complexity, a significantly smaller C can make the program run much quicker.