Почему в javascript не срабатывает условие?

Question

[ivankalachikov86]

Изучаю js, выполняя одну задачку сделать игру змейку столкнулся с непонятной ситуацией при проверке не вышла ли змейка за пределы поля?

Вот проверка:

if (col < 1 || col > COLS || row < 1 || row > ROWS) {
    return 'gameover';
}

причем проверка на col срабатывает, а на row - нет. Выводил в консоль значения переменных - при выходе за границы вниз row становится 21, а ROWS=20. Не пойму что за мистика. Подскажите пожалуйста.

Ссылка на код в codepen: codepen.io/Kalachikov/pen/oLjpXb

Comments

[OVK2015]

Для или хватает 1-го true. Дальше условия не проверяет

[ivankalachikov86]

в данном случае даже когда первые два условия (для col) = false , a row попадает под описанные условия, т.е. row>ROWS функция не возвращает 'gameover';

[OVK2015]

ivankalachikov86: На "Ответить" нажимайте не видно, что пишете.

var COLS = 20,
      ROWS = 20,
      col = 1,
      row = 21;
if ((col < 1) || (col > COLS) || (row < 1) || (row > ROWS))
{
    console.log('gameover');
}

[ivankalachikov86]

OVK2015: да, при вашем написании, если взять его отдельно, код срабатывает как надо. Видимо у меня ошибка в чем-то другом.
console.log('row= ' + row + 'ROWS = ' + ROWS);

вот что выводит консоль:
row= 21 ROWS = 20
и 'gameover' не возращает

Answer 1

[Виталий Инчин ☢]

Условие то выполняется. Но затем вы вызываете getCellByIndex(21, 1). Эта функция возвращает undefined, так как нету элемента с таким "id"...

if(21 > 20){
  
    getCellByIndex(21, 1).style.....

}

А вообще, подход у вас странный - не лучше ли представить поле как таблицу (я про <table>)? Тем более, раз уж не хотите собрать все элементы 1 раз и положить во многомерный массив, а собираете их каждый раз через querySelectorAll (который и не гарантирует, что порядок будет верным). С таблицами то работать проще: тык