JavaScript. Учебник начального уровня - [9]

В этой главе нам осталось поговорить о новом методе, который нам понадобился. Для его работы я ввёл небольшой вспомогательный метод hasMine:

this.hasMine = function(i, j)
{
if ((i < 0) || (j < 0) || (i >= this.rowCount) || (j >= this.colCount))
return 0;
if (this.mines[i * this.rowCount + j] == 1)
return 1;
return 0;
}

Этот метод принимает индекс строки и столбца для ячейки и возвращает ноль, если хотя бы один из индексов за пределами нашей таблицы (это проверяется в первой строке). Напомню, на всякий случай, что "||" соответствует логической операции «ИЛИ». Третья строка непосредственно проверяет, есть–ли в ячейке бомба и если она есть, мы возвращаем единичку. И, наконец в конце, если мы всё ещё не вышли из функции (ничего не вернули, так как ни одно из условий не выполнилось), мы тоже возвращаем ноль.

Ну и наконец последнее, сам метод checkCell. Он тоже принимает на вход номер строки и столбца. Давайте сперва посмотрим на его реализацию.

this.checkCell = function(i, j)
{
if (this.hasMine(i, j))
return '*';
return this.hasMine(i - 1, j - 1) + this.hasMine(i - 1, j) + this.hasMine(i - 1, j + 1) +
this.hasMine(i, j - 1) + this.hasMine(i, j + 1) +
this.hasMine(i + 1, j - 1) + this.hasMine(i + 1, j) + this.hasMine(i + 1, j + 1);
}

На самом деле он сдеан довольно–таки топорно и куда элегантней, да и правильней, наверное, было бы сделать вложенный цикл, но так мне показалось нагляднее. Можете поэкспериментировать если будет желание. Помните, от row, равной i - 1, до row <= i + 1 выполним от col = j - 1 до col <= j + 1, res += this.hasMine(row, col).

Ладно, вернёмся к тому, как это сделал я. Сначала мы проверяем наличие бомбы непосредственно для ячейки со строкой i и столбцом j, если она там есть, мы возвращаем "*". Если бомбы нет, мы возвращаем сумму результатов функции hasMine для всех соседей. Как вы помните, hasMine возвращает ноль, если бомбы нет и единицу, если она там есть, таким образом, мы вернём именно то, что хотели.

Уже можно играть

Продолжу серию статей про программирование для JavaScript. Сегодняшняя статья рискует закончить что–то вроде учебника по этому языку. В вашего сапёра после этой главы уже можно будет играть. Конечно, останется ещё ряд недоделок, например, стоит добавить сообщения при выигрыше и при проигрыше, нужно также сделать так, чтобы при открытие ячейки, рядом с которой нет бомб автоматически открывались также все её соседи. Ещё было бы не плохо сделать возможность выбирать размер поля и количество бомб на нём, добавить возможность помечать ячейки как ячейки с бомбами.

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

Сегодня впервые я решил не приводить весь код программы, так как изменения коснулись только функции initTable. Вот во что она превратилась:

var mines = new minesClass(10, 10, 10);
        function checkCell(i, j)
        {var tbl = document.getElementById(«tbl»);
              var cell = tbl.rows[i].cells[j];
              var s = mines.checkCell(i, j);
              cell.innerHTML = s;
              if (s == "*")
                    cell.bgColor = 'red';}

        function initTable()
        {var tbl = document.getElementById(«tbl»);
              for (var i = 0; i < mines.rowCount; i++)
              {var row = tbl.insertRow(i);
                    for(var j = 0; j < mines.colCount; j++)
                    {var cell = row.insertCell(j);
                          cell.innerHTML = '?';
                          function SetCellClick(i, j)
                          {cell.onclick= function() {checkCell(i, j)};};
                          SetCellClick(i, j);}}}

Давайте по порядку. Строчку «var mines = new minesClass(10, 10, 10);" я перенёс наверх, чтобы переменная mines стала доступна из других функций (напомню, что переменная, объявленная внутри функции доступна только внутри этой функции, а «внешние» переменные доступны также в других функциях). Нам потребуется использовать эту переменную в функции checkCell, которую мы выделили из функции initTable.

По сути, в функции checkCell мы получаем из таблицы ячейку с i-ой строкой и j-ым столбцом и присваиваем ей текст, соответствующий количеству бомб рядом (раньше мы это делали непосредственно при инициализации таблицы). Для получения ссылки на ячейку, мы получаем ссылку на таблицу с помощью метода getElementById заранее предопределённой переменной document. Далее мы получаем ссылку на нужную строку, обращаясь к полю rows таблицы (это массив, поэтому после имени поля в квадратных скобках указываем индекс) и сразу же обращаемся к полю cells строки (это тоже массив) для получения искомой ссылки на ячейку.

Последующие строки функции checkCell мы перенесли из функции initTable без изменений.

Ну и последнее о чём осталось рассказать — функция initTable. Несколько строчек мы оттуда унесли и появилась, несколько добавили:

                      cell.innerHTML = '?';
                      function SetCellClick(i, j)