К сожалению в каждой новой главе, кода становится всё больше, при этом нового кода вообще говоря всего ничего. Это вечная дилема — приводить куски кода в каждой новой главе, но тогда могут быть проблемы с пониманием того, что к чему относится, либо постоянно копировать и тогда текст раздувается до каких–то нереальных размеров. Я пока решил придерживаться второго варианта. Дальше посмотрю.
Мы видим уже знакомую страничку со скриптом. Посмотрим скрипт снизу вверх. Внизу у нас уже знакомая по прошлой статье функция initTable(). В чём её отличие от предыдущей реализации. Во–первых, тут мы добавили переменную minesCount, которой сразу же присвоили значение 10. Кроме того, мы объявили переменную mines, которой присвоили результат функции fillMines с числом строк, столбцов и мин в качестве параметров. Подробнее о том, как устроена эта функция я расскажу ниже, скажу лишь что представляет собой её результат. Функция fillMines возвращает массив длины rowCount * colCount, причём для каждому элементу массива, равному единице соответствует мина, а иначе мины нет.
Что же такое массив? Это особый тип переменной, которая сама по себе ничего не хранит, но как бы предоставляет доступ к другим переменным внутри себя. Вариант классического массива — это как бы набор элементов, доступ к которым осуществляется по индексу. Например, Arr — это массив, тогда Arr[0] — это переменная, соответствующая нулевому элементу массива Arr. Ну и так далее.
Каким образом наш массив mines будет соотноситься с нашей таблицей? Да всё очень просто. Для первой строки первого столбца, то есть элемента [0, 0] (будем нумеровать с нуля, в программировании так почти везде) будет соответствовать нулевой элемент массива [0]. Для первой строки второго столбца [0, 1] — первый элемент массива [1]. Для [0, 9] — [9]. Для первой строки закончились столбцы — не беда, теперь возьмём вторую строку первый столбец [1, 0], этой ячейке будет соответствовать десятый элемент массива mines, то есть, в нашей терминологии, [10]. Так будем идти дальше, пока не дойдем до последней (десятой) строки и последнего (десятого) столбца [9, 9], им будет соответствовать элемент [99].
Всё это на самом деле можно записать куда короче: [i, j] соответствует [i * colCount + j]. Можете проверить на листе бумаги.
Хорошо, мы получили наш массив с бомбами. По сути это основное функциональное отличие от того, что мы делали в прошлой статье. Далее мы видим уже знакомый вложенный цикл, мы получаем переменную ячейки, а дальше, вместо того, чтобы положить туда строку «cell» с индексами ячейки в таблице, мы пишем сразу 4 строки.
if (mines[i * rowCount + j] == 1)
cell.innerHTML = '*'
else
cell.innerHTML = '.';
Тут мы снова сталкнёмся с новой конструкцией. Оператор if или условный оператор. Что это такое? Давайте опять попробуем перевести фразу на русский: «если (mines[i * rowCount + j] == 1), то выполнить cell.innerHTML = '*', а иначе выполнить cell.innerHTML = '.'". Другими словами, если выполняется условие после if (в JavaScript обязательно заключено в круглые скобки), выполняется блок (в нашем случае одна строка, так как нет фигурных скобок обрамляющих блок) сразу после оператора if, если же условие не выполняется (не обязательно, блока else может и не быть), выполняется блок сразу после оператора else. Если за блоком, идущем сразу после блока if нет оператора else, последующий код выполняется всегда, независимо от выполнения или невыполнения условия.
Что же значит выполнение условия, давайте внимательней разберём выражение «mines[i * rowCount + j] == 1». «mines[i * rowCount + j]» — это, как вы вероятно уже догадались переменная, которая соответствует текущей ячейке (строка i, столбец j) в нашем массиве бомб. Как вы помните, эта переменная равна 1, если бомба в соответствующей ячейке есть. Именно равенство переменной единице мы и проверяем. Оператор точного сравнения переменных в JavaScript — "==".
Давайте немного потренируемся составлять такие условия. (i > 2) — значение переменной i больше, чем 2. (i != 3) — значение переменной i не равно 3. (i == j) — значение переменной i равно значению переменной j.
Ну и чтобы формально закончить рассмотрение этого кусочка кода. Получается, что если у нас есть бомба в ячейке — мы делаем текст ячейки равным строке '*', если же бомбы нет — строке '.'.
Теперь перейдём к рассмотрению следующей большой функции в нашем скрипте - fillMines.
function fillMines(rowCount, colCount, minesCount)
{
var res = new Array(rowCount * colCount);
var mines = minesCount;
while (mines > 0)
{