Цикл while: синтаксис, примеры

1. Синтаксис цикла while

Представьте, что вам нужно вывести на экран все элементы массива из 100 значений. Можно, конечно, написать сто раз console.log(arr[0]), console.log(arr[1]) ... Но это не только скучно, но и абсолютно неэффективно. А если элементов станет 200? Или 1000?

Циклы — это как робот-помощник: вы даёте ему правило, а он повторяет нужное действие столько раз, сколько потребуется. В программировании есть несколько видов циклов, и первый из них — цикл while.

Цикл while выполняет блок кода до тех пор, пока условие истинно.

Вот его базовый синтаксис:

while (условие) {
    // блок кода, который будет выполняться снова и снова
}

• Условие — это выражение, которое возвращает true или false.
• Если условие истинно (true), цикл выполняет тело (код в фигурных скобках).
• После выполнения тела снова проверяется условие. Если оно всё ещё истинно — тело выполняется снова.
• Как только условие становится ложным (false), цикл останавливается, и выполнение программы идёт дальше.

Простейший пример

let counter = 1;
while (counter <= 5) {
    console.log('Счётчик:', counter);
    counter = counter + 1; // или counter++
}

Что произойдёт?

• Переменная counter изначально равна 1.
• Пока counter не больше 5, цикл выводит значение и увеличивает счётчик.
• Как только counter станет 6, условие counter <= 5 станет ложным, и цикл завершится.

Результат:

Счётчик: 1
Счётчик: 2
Счётчик: 3
Счётчик: 4
Счётчик: 5

2. Как работает цикл while: пошаговая схема

Чтобы лучше понять механику, представьте цикл как карусель, которая крутится, пока не устанет.

Вот блок-схема работы цикла while:

+----------------------+
|    Проверить условие |
+----------+-----------+
           |
         (да)
           v
+----------+-----------+
|    Выполнить тело    |
+----------+-----------+
           |
           v
   (вернуться к проверке)
           ^
           |
         (нет)
           v
+----------------------+
|   Выйти из цикла     |
+----------------------+

3. Важные детали: как не попасть в "вечный цикл"

Обновление переменной

Очень важно, чтобы внутри тела цикла происходило изменение переменных, участвующих в условии. Если этого не сделать — цикл может никогда не закончиться, и ваша программа зависнет (привет, "вечный цикл").

Пример плохого кода:

let i = 1;
while (i <= 5) {
    console.log(i);
    // i никогда не изменяется!
}

Этот цикл будет печатать единицу бесконечно долго. Ваш браузер или Node.js быстро скажет "ой, что-то пошло не так".

Как избежать вечного цикла?

Убедитесь, что переменная, проверяемая в условии, обязательно изменяется внутри тела цикла.

4. Примеры использования while

Считаем от 1 до 10

let num = 1;
while (num <= 10) {
    console.log(num);
    num++;
}

Обратный отсчёт

let countdown = 5;
while (countdown > 0) {
    console.log('Осталось:', countdown);
    countdown--;
}
console.log('Поехали!');

Результат:

Осталось: 5
Осталось: 4
Осталось: 3
Осталось: 2
Осталось: 1
Поехали!

Перебор массива вручную

В прошлой лекции вы уже вручную перебирали массив по индексам. Теперь давайте сделаем это с помощью цикла while.

const fruits = ['яблоко', 'банан', 'груша', 'апельсин'];
let index = 0;

while (index < fruits.length) {
    console.log('Фрукт:', fruits[index]);
    index++;
}

Результат:

Фрукт: яблоко
Фрукт: банан
Фрукт: груша
Фрукт: апельсин

Чтение данных до определённого значения

Иногда нужно выполнять действия, пока пользователь не введёт, например, слово "стоп".

let input = '';
while (input !== 'стоп') {
    input = prompt('Введите что-нибудь (или "стоп" для выхода):');
}
console.log('Цикл завершён!');

5. Практика: развиваем ваше учебное приложение

Допустим, у вас есть массив с числами — оценки студента по разным предметам:

const scores = [5, 3, 4, 5, 2, 4];

Давайте напишем цикл, который посчитает сумму всех оценок.

let sum = 0;
let i = 0;

while (i < scores.length) {
    sum += scores[i]; // то же самое, что sum = sum + scores[i]
    i++;
}

console.log('Сумма всех оценок:', sum);

Попробуйте изменить массив — цикл всё равно посчитает сумму корректно!

6. Типичные ошибки при работе с while

Ошибка №1: вечный цикл

Самая частая беда — забыли изменить переменную, участвующую в условии. В результате цикл никогда не закончится. Например:

let n = 10;
while (n > 0) {
    console.log(n);
    // n--; // забыли уменьшить!
}

Этот цикл будет работать бесконечно (и очень быстро забьёт консоль).

Ошибка №2: неверное условие

Иногда условие цикла составлено так, что цикл вообще не выполнится ни разу. Например:

let x = 5;
while (x < 3) {
    console.log(x);
    x++;
}

Здесь x < 3 сразу ложно, поэтому тело цикла ни разу не выполнится.

Ошибка №3: неправильное использование индекса

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

let arr = [1, 2, 3];
let i = 1; // должно быть 0!
while (i < arr.length) {
    console.log(arr[i]);
    i++;
}

В этом примере первый элемент массива будет пропущен.

Ошибка №4: забыли про граничные значения

Если условие слишком "широкое", цикл может выйти за пределы массива:

let arr = [1, 2, 3];
let i = 0;
while (i <= arr.length) { // должно быть i < arr.length
    console.log(arr[i]); // arr[3] — undefined!
    i++;
}

В этом случае на последней итерации arr[i] будет undefined.

1

Задача

Модуль 1: Web Core, 21 уровень, 2 лекция

Недоступна

Новый абзац

Новый абзац

Открыть

1

Задача

Модуль 1: Web Core, 21 уровень, 2 лекция

Недоступна

Вставка элемента

Вставка элемента

Открыть