Javascript + Canvas реализация Game of Life не работает

Question

У меня проблемы с реализацией Javascript + canvas игры Conways Game of Life.Ячейки создаются очень хорошо, и холст в штучной упаковке, представляющий ячейки, также отрисовывается отлично.Но где-то на этом пути все клетки, кажется, заживо и не переключаются.Для жизни я не могу понять, что не так.Код javascript здесь , а моя реализация здесь .Может кто-нибудь, пожалуйста, скажите мне, где я ошибся.

************************ EDIT ************************

Мне кажется, я понял, что не так.Я передаю элемент массива 2d в функцию realToggle (), например:

var reallyToggle = function(a) {
//code
}
reallyToggle(cell[i][j]);

Я думаю, что проблема заключается в этой части кода.Может кто-нибудь сказать мне, как я могу передать элемент массива в функцию?

Answer 1

Так что ваш код довольно неясен и чрезмерно сложен, если честно. Создание сетки пользовательских объектов функций Javascript - это слишком сложная задача: все, что вам нужно, это двумерный логический массив.

Подобные проблемы часто легче всего решить, если рассматривать их как две отдельные проблемы: проблемное пространство и мировое пространство. Проблемное пространство - это область, в которой вы решаете актуальную проблему. Пространство мира - это проблемное пространство, отображаемое на визуальный результат. Чтобы отделить его от вашей проблемы, представьте, что проблемное пространство - это двумерный массив логических значений, и тогда мировое пространство - это ваш холст.

Если вы хотите немного очистить симуляцию, вот подход, который может помочь:

//Have some parameters that you can change around
var cellSize = 10;
var cellsWide = 100;
var cellsHigh = 100;

//Instantiate and initialize a 2d array to false
var theGrid = new Array();

for (var i=0; i<cellsWide; i++) {
    theGrid.push(new Array());
    for (var j=0; j<cellsHeight; j++) {
        theGrid[i].push(false);
    }
}

//Attach a click event to your canvas (assuming canvas has already been dropped on page
//at the assigned width/height
$('#simCanvas').click(function(e) {
    var i = Math.floor((e.pageX - this.offsetLeft)/cellSize);
    var j = Math.floor((e.pageY - this.offsetTop)/cellSize);
    theGrid[i][j] = !theGrid[i][j];
});

Это был бы гораздо более лаконичный способ решения проблемного пространства. Отображение проблемного пространства в мировое пространство немного проще, но если вам нужна помощь, просто дайте мне знать.

Приветствия

Answer 2

Эта строка довольно подозрительна:)

if (!run) run == true;

Answer 3

Прежде всего, проверьте ответ MoarCodePlz. А по поводу Вашего кода:

Uncaught exception: ReferenceError: Undefined variable: gameLoop при нажатии пуск. Все Ваши функции, определенные в initialize, не находятся в глобальной области видимости, поэтому они недоступны в глобальной области.

Пожалуйста, используйте Firebug; Инструменты разработчика Chrome, Opera Dragonfly или что-то, чтобы обнаружить такие ошибки. Эти инструменты действительно помогают при разработке JS.