Цикли JavaScript необхідні для ефективної обробки повторюваних завдань. Вони виконують блок коду неодноразово, доки виконується певна умова. Ці цикли є потужними інструментами для автоматизації завдань і оптимізації коду.
Наприклад, припустімо, що ми хочемо надрукувати Привіт Світ 5 разів. Це легко можна зробити за допомогою JS Loop. У циклі оператор потрібно написати лише один раз, і цикл буде виконано 5 разів, як показано нижче:
JavaScript for (let i = 0; i < 5; i++) { console.log('Hello World!'); }> Вихід
Hello World! Hello World! Hello World! Hello World! Hello World!>
Зміст
- для циклу
- цикл while
- Цикл do-while
- for-in Loop
- for-of Loop
- Позначена заява
- Інструкція Break
- Продовжити заяву
- Нескінченний цикл (помилка циклу)
1. JavaScript для циклу
The Цикл JS for забезпечує стислий спосіб запису структури циклу. Цикл for містить ініціалізацію, умову та інкремент/декремент в одному рядку, що забезпечує коротшу структуру циклу, яку легко налагодити.
Синтаксис
for (initialization; testing condition; increment/decrement) { statement(s) }>Блок-схема
- Умова ініціалізації: Він ініціалізує змінну та позначає початок циклу for. Можна використовувати вже оголошену змінну або оголошувати змінну, лише локально для циклу.
- Умови тестування: Він використовується для тестування умови виходу з циклу for. Він повинен повертати логічне значення. Це також є Петля контролю входу оскільки умова перевіряється перед виконанням операторів циклу.
- Виконання заяви: Після того, як умова оцінюється як істинна, оператори в тілі циклу виконуються.
- Збільшення/Зменшення: Він використовується для оновлення змінної для наступної ітерації.
- Завершення циклу: Коли умова стає помилковою, цикл завершується, позначаючи кінець його життєвого циклу.
приклад
Javascript // JavaScript program to illustrate for loop let x; // for loop begins when x = 2 // and runs till x <= 4 for (x = 2; x <= 4; x++) { console.log('Value of x: ' + x); }> Вихід
Value of x: 2 Value of x: 3 Value of x: 4>
2. Цикл JavaScript while
The JS цикл while це інструкція потоку керування, яка дозволяє багаторазово виконувати код на основі заданої булевої умови. Цикл while можна розглядати як повторюваний оператор if.
Синтаксис
while (boolean condition) { loop statements... }>Блок-схема
- Цикл while починається з перевірки умови. Якщо це оцінено як істинне, тоді виконуються оператори тіла циклу, інакше виконується перший оператор, наступний за циклом. З цієї причини його також називають Вхідний контур контролю
- Після того, як умова оцінюється як істинна, оператори в тілі циклу виконуються. Зазвичай оператори містять оновлене значення для змінної, яка обробляється для наступної ітерації.
- Коли умова стає хибною, цикл завершується, що означає кінець його життєвого циклу.
приклад
Javascript // JavaScript code to use while loop let val = 1; while (val < 6) { console.log(val); val += 1; }> Вихід
1 2 3 4 5>
3. Цикл JavaScript do-while
The Цикл JS do-while подібний до циклу while з тією лише різницею, що він перевіряє умову після виконання операторів, і тому є прикладом Вийти з циклу керування. Він виконує вміст циклу принаймні один раз, якщо умова хибна.
Синтаксис
do { Statements... } while (condition);> Блок-схема 
- Цикл do-while починається з виконання оператора(ів). Перевірка жодного стану з першого разу не проводиться.
- Після виконання операторів і оновлення значення змінної умова перевіряється на істинне чи хибне значення. Якщо воно оцінюється як істинне, починається наступна ітерація циклу.
- Коли умова стає хибною, цикл завершується, що означає кінець його життєвого циклу.
- Важливо відзначити, що цикл do-while виконає свої оператори принаймні один раз перед перевіркою будь-якої умови, тому є прикладом циклу керування виходом.
приклад
Javascript let test = 1; do { console.log(test); test++; } while(test <= 5)> Вихід
1 2 3 4 5>
4. JavaScript for-in Loop
Цикл for-in JS використовується для повторення властивостей об’єкта. Цикл for-in повторює лише ті ключі об’єкта, для яких властивість enumerable має значення true.
Синтаксис
for(let variable_name in object_name) { // Statement }>приклад: У цьому прикладі показано використання циклу for-in.
Javascript let myObj = { x: 1, y: 2, z: 3 }; for (let key in myObj) { console.log(key, myObj[key]); }> Вихід
x 1 y 2 z 3>
5. Цикл JavaScript for-of
Цикл for-of JS використовується для ітерації ітерованих об’єктів, наприклад масиву, об’єкта, набору та карти. Він безпосередньо повторює значення заданого ітерованого об’єкта та має більш стислий синтаксис, ніж цикл for.
Синтаксис:
for(let variable_name of object_name) { // Statement }>приклад: У цьому прикладі показано використання циклу for-of.
Javascript let arr = [1, 2, 3, 4, 5]; for (let value of arr) { console.log(value); }> Вихід
1 2 3 4 5>
6. Позначений оператор JavaScript
Ключове слово мітки JS не містить ключового слова goto. Користувачі можуть використовувати ключове слово continue із оператором label. Крім того, користувачі можуть використовувати ключове слово break для завершення циклу/блоку. Ви також можете використовувати ключове слово break без визначення мітки, але воно завершує лише батьківський цикл/блок. Щоб завершити зовнішній цикл із внутрішнього за допомогою ключового слова break, користувачі повинні визначити мітку.
Синтаксис
Label: statement (loop or block of code)>
приклад
Javascript let sum = 0, a = 1; // Label for outer loop outerloop: while (true) { a = 1; // Label for inner loop innerloop: while (a < 3) { sum += a; if (sum>12) { // Розірвати зовнішній цикл із внутрішнього break outerloop; } console.log('sum = ' + sum); a++; } }> Вихід
sum = 1 sum = 3 sum = 4 sum = 6 sum = 7 sum = 9 sum = 10 sum = 12>
7. Інструкція JavaScript Break
Оператор JS break використовується для припинення виконання циклу або оператора switch, коли умова виконується.
Синтаксис
break;>
приклад
Javascript for (let i = 1; i < 6; i++) { if (i == 4) break; console.log(i); }> Вихід
1 2 3>
8. Оператор продовження JavaScript
Оператор продовження JS використовується для переривання ітерації циклу та наступної ітерації. Перерва в ітерації можлива лише тоді, коли відбудеться зазначена умова. Основна відмінність між операторами continue і break полягає в тому, що оператор break повністю виривається з циклу, тоді як continue використовується для розриву одного оператора та переходу до наступного.
Синтаксис
continue;>
приклад
Javascript for (let i = 0; i < 11; i++) { if (i % 2 == 0) continue; console.log(i); }> Вихід
1 3 5 7 9>
9. Нескінченний цикл JavaScript (помилка циклу)
Однією з найпоширеніших помилок при реалізації будь-якого циклу є те, що він може ніколи не завершитися, тобто цикл виконується нескінченно. Це трапляється, коли умова з якоїсь причини не виконується.
приклад: Цей приклад демонструє нескінченний цикл.
Javascript // JavaScript program to illustrate infinite loop // Infinite loop because condition is not false // condition should have been i>0. для (нехай i = 5; i != 0; i -= 2) { console.log(i); } нехай x = 5; // Нескінченний цикл, оскільки оператор оновлення // не надається while (x == 5) { console.log('У циклі'); }>