Циклы for и while в JavaScript

Цикл for

Циклу for в круглых скобках передаются 3 аргумента:

1. Переменная цикла с начальным значением.
2. Условие входа в цикл.
3. Действие, выполняемое после каждого прохождения тела цикла.

Аргументы разделяются точкой с запятой ;. Все 3 аргумента являются необязательными, но ; ставить обязательно.

var i;
for (i = 2; i < 7; i = i * 2) {
  alert(i);
}

Работа скрипта по шагам для данного примера:

• Переменной i присваивается начальное значение 2.
• Затем проверяется условие входа в цикл (2 < 7). Значение условия true, следовательно выполняются действия в теле цикла (выводится сообщение с числом 2).
• Далее выполняется действие, указанное третьим аргументом цикла (i = i * 2, т.е. переменная i получает значение 4).
• Скрипт возвращается к началу цикла и проверяет условие (4 < 7). Значение снова true и на экране выводится сообщение с числом 4.
• Переменной i присваивается значение 8.
• Скрипт возвращается к началу цикла и проверяет условие (8 < 7). Теперь значение false и дальше цикл не выполняется.

Цикл while

Цикл while имеет более простую конструкцию, чем for. Ему передается всего один аргумент - условие входа в цикл.

var i = 1;
while (i < 3) {
  alert(i);
  i++;
}

Описание примера по шагам:

• Проверяется условие для входа в цикл (1 < 3). Значение условия true, следовательно выполняются действия в теле цикла (выводится сообщение с числом 1 и переменной i присваивается новое значение 2).
• Снова проверяется условие для входа в цикл (2 < 3). Значение условия true, следовательно выполняются действия в теле цикла (выводится сообщение с числом 2 и переменной i присваивается новое значение 3).
• Проверяется условие для входа в цикл (3 < 3). Теперь значение false - дальше цикл не выполняется.

Данный цикл легко воспринимается, так как все операции выполняются в той последовательности, в которой расположены. Хотя с помощью цикла for запись была бы короче:

for (var i = 1; i < 3; i++) {
  alert(i);
}

Цикл do…while

Цикл do…while имеет конструкцию, схожую с while. Ему также передается всего один аргумент, но это уже условие для повторения цикла, так как цикл обязательно выполнится хотя бы один раз.

var i = 4;
do {
  alert(i);
} while (i < 3)

Значение условия false, но цикл все равно выполнится один раз.

Случаи, когда необходимо использовать данный цикл, очень редки. К тому же его всегда можно заменить на цикл while, а необходимые действия указать перед циклом.

Директива break

Чтобы принудительно прервать выполнение всего цикла, используется директива (ключевое слово) break.

for (var i = 0; i < 3; i++) {
  if (i == 1) break;
  alert(i);
}

В данном примере будет выведено только одно сообщение с числом 0, так как при i = 1 цикл будет остановлен.

Директива continue

Директива (ключевое слово) continue используется, чтобы принудительно прервать выполнение команд в теле цикла и перейти к проверке условия.

for (var i = 0; i < 3; i++) {
  if (i == 1) continue;
  alert(i);
}

В данном примере при i = 1 выполнение действий в теле цикла будет остановлено, но работа цикла будет продолжена с проверки условия. В результате будут выведены сообщения с числами 0 и 2.