Цикли

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

Термінологія:

• Цикл - конструкція призначена для багаторазового виконання набору інструкцій, поки виконується якась умова.

• Тіло циклу - інструкції, призначені для багаторазового виконання.

• Ітерація - один раз виконання тіла циклу.

• Умова виходу - вираз, який визначає, чи буде в ще раз виконуватися ітерація, або цикл завершиться.

• Лічильник - змінна, яка зберігає поточний номер ітерації. Цикл не обов'язково містить лічильник, і він не повинен бути один, умова виходу з циклу може залежати від декількох змінних, що змінюються в циклі.

Цикл while

Цикл while використовується для повторення nіла циклу, доки певна умова залишається true. Це дозволяє виконувати один або кілька операторів, поки умова циклу виконується.

while (умова) {
    // Код, який виконується поки умова true
    // Цей код буде виконуватися, доки умова залишається true
}

Це - цикл з передумовою. Спочатку перевіряється умова, а потім виноується тіло циклу. Відтак цикл може не виконатися жодного разу, якщо при першій ітерації не виконується умова.

Порядок виконання циклу while:

• У циклі while умова перевіряється перед кожною ітерацією.

• Якщо умова приводиться до true, то виконується тіло циклу.

• Якщо умова приводиться до false, то виконання циклу переривається і продовжуєтьсявиконання скрипту, що йде після циклу while.

Розробник продумує спосіб вирахування, коли має закінчитись цикл, зазвичай, вводять лічильник, який впливає на умову виконання циклу.

Створимо цикл, який виводить лічильник в консоль.

let count = 0;

while (count < 5) {
    console.log("Поточне значення count: " + count);
    count++;
}

Результат виконання цього циклу

Можна також написати цикл, який буде виконувати на кожній ітерації якісь дії з якоюсь іншою змінною. Наприклад порахуємо суму чисел від 0 до 4.

let summ = 0;
let count = 0;

while (count < 5) {
  console.log("Поточне значення count: " + count);
  summ += count;
  count++;
}

console.log("Сума: ", summ);

Цикл do...while

Цикл do...while є одним із типів циклів, що використовуються для повторення блоку коду, поки задана умова є true. Одна з особливостей цього циклу полягає в тому, що код блоку виконується принаймні один раз, навіть якщо умова спочатку не виконується.

do {
    // Блок коду, який буде виконуватися принаймні один раз
    // після чого перевіряється умова
} while (умова);

Це - цикл з постумовою. Тут умова перевіряється після виконання тіла циклу.

Всередині циклу треба врахувати зміну параметрів, щоб в якийсь момент умова могла стати false. інакше це буде безкінечний цикл.

Розглянемо приклад, коли цикл буде показувати повідомлення із запитом ввести пароль більше 5 символів. І поки не виконається ця умова - буде виводитися вікно введення паролю.

let password;

do {
  password = prompt("Enter your password");
} while (password.length < 6);

console.log("Your password is: ", password);

Цикл for

Цикл for використовують для повторення блоку коду певну кількість разів або для перебору елементів у масивах або об'єктах. Він дозволяє точно контролювати ітерації через спеціальні параметри циклу.

for (ініціалізація; умова; крок) {
    // Код, який буде виконуватися кожну ітерацію циклу
}

Робота циклу for:

• Ініціалізація (initialization) - виконується один раз до початку циклу. Встановлює початкову точку циклу, наприклад, ініціалізує лічильник.

• Умова (condition) - умова, яка перевіряється перед кожною ітерацією (повторенням) циклу. Якщо умова true, цикл продовжується; якщо false, цикл завершується.

• Крок (post-expression) - крок або зміни, які відбуваються кожен раз після виконання блоку коду. Використовується для оновлення змінної-лічильника.

• Тіло (statements) - набір інструкцій для виконання на кожному повторенні циклу. Виконується, якщо умова приводиться до true.

Змінні-лічильники, за традицією, називають літерами i, j і k.

Приклад використання циклу for для виведення чисел від 1 до 5:

for (let i = 1; i <= 5; i++) {
    console.log(i);
}

У цьому прикладі:

• let i = 1 - встановлюємо лічильник i в 1.

• i <= 5 - умова перевіряє, чи i менше або дорівнює 5.

• i++ - після кожної ітерації збільшуємо i на 1.

Напишемо цикл for, який порахує суму чисел від 0 до 4 (вище робили реалізацію на циклі while).

let summ = 0;

for (let i = 0; i <= 4; i += 1) {
  console.log("Поточне значення лічильника: " + i);
  summ += i;
}

console.log("Сума: ", summ);

Оператор break

Оператор break використовується для негайного припинення виконання циклу, коли виконується певна умова, незалежно від того, чи виконалася вся ітерація циклу чи ні.

Оператор break використовується у циклах (for, while, do...while, for...in, for...of) і має такий синтаксис:

for (let i = 0; i < 10; i++) {
    if (i === 5) {
        break; // Припиняє виконання циклу, коли i дорівнює 5
    }
    console.log(i);
}

console.log("Log after loop");

У цьому прикладі, коли i дорівнює 5, оператор break викликається, і виконання циклу завершується. Таким чином, виведені будуть числа від 0 до 4, оскільки при i = 5 цикл припиняється.

Оператор continue

Оператор continue використовується для переходу до наступної ітерації циклу, пропускаючи решту коду блоку циклу для поточної ітерації. Коли викликається continue, виконання поточної ітерації припиняється, і управління передається наступній ітерації циклу.

Оператор continue використовується у циклах (for, while, do...while, for...in, for...of) і має такий синтаксис:

for (let i = 0; i < 5; i++) {
    if (i === 2) {
        continue; // Пропускає виконання решти коду блоку для i = 2
    }
    console.log(i);
}

У цьому прикладі, коли i дорівнює 2, оператор continue викликається, пропускаючи виконання решти коду у поточній ітерації. Таким чином, виведені будуть числа від 0 до 4, але 2 буде пропущено.