Свайпніть щоб показати меню

Цикл for є базовою структурою циклів у JavaScript, хоча спочатку його може бути складно зрозуміти. Він використовує ключове слово for і вимагає трьох параметрів, які розміщуються в дужках:

for (Initialization; Condition; Increment / Decrement) {
  // code block
}

Ось детальний опис цих параметрів:

Initialization: Тут ініціалізується новий лічильник, який використовується у циклі for. Виконується лише один раз;
Condition: Вираз, який перевіряється перед кожною ітерацією, подібно до циклу while;
Increment/Decrement: Операції, які виконуються над лічильником наприкінці кожної ітерації циклу.

Примітка

Ітерація у циклах означає повторення блоку коду певну кількість разів або до виконання певної умови. Кожне виконання блоку коду вважається однією ітерацією.

Розглянемо це на прикладі:


              123
            
for (let i = 1; i < 5; i++) {
  console.log("Loop iteration:", i);
};

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

let i = 1: Ініціалізація, створення змінної i всередині циклу for. Ця операція виконується один раз;
i < 5: Умова, перевіряється перед кожною ітерацією;
i++: Вираз інкременту, виконується після кожної ітерації;
console.log("Loop iteration:", i);: Тіло циклу for.

Кожен крок у циклі можна описати наступним чином:

// Step 1: Counter initialization
let i = 1;
// Step 2: Main loop body
if (i < 5) { // Condition check
  console.log("Loop iteration:", i); // Loop body
}
i++; // Increment operation

Крок 2 повторюється, доки умова не стане false.

Корисно розглянути діаграму для кращого розуміння роботи циклу.

У циклі for також можна використовувати декремент, як показано нижче:


              123
            
for (let i = 15; i > 10; i--) {
  console.log("i =", i);
}

Лічильник циклу for є унікальним у межах своєї області видимості, тому не потрібно турбуватися про конфлікт імені лічильника з іншими змінними:


              12345678
            
let i = 2077;
console.log("(global) i =", i);

for (let i = 0; i < 4; i++) {
  console.log("(for) i =", i);
}

console.log("(global) i =", i);

Можна також використовувати різні вирази для операцій інкременту/декременту:


              123
            
for (let i = 0; i < 40; i += 7) {
  console.log("i =", i);
};

Порівняння циклів for та while

Порівнюючи цикли for та while, цикл for часто є простішим і лаконічнішим. Ось приклад еквівалентних циклів:


              1234567891011
            
// `while`
let a = 1;
while (a <= 3) {
  console.log("While:", a);
  a++;
}

// `for`
for (let i = 1; i <= 3; i++) {
  console.log("For:", i);
}

У цьому порівнянні цикл for є більш зрозумілим і займає менше місця в коді. Крім того, цикл for автоматично очищає змінну-лічильник (у цьому випадку, i) після виконання.

Все було зрозуміло?

Дякуємо за ваш відгук!

Секція 5. Розділ 3

Запитати АІ

Запитайте про що завгодно або спробуйте одне із запропонованих запитань, щоб почати наш чат

Секція 5. Розділ 3

Оволодіння Циклом For у JavaScript

Порівняння циклів for та while