JavaScript для цикла (с примерами)

В этом руководстве вы узнаете о циклах и о циклах for в JavaScript с помощью примеров.

В программировании циклы используются для повторения блока кода.

Например, если вы хотите показать сообщение 100 раз, вы можете использовать цикл. Это просто простой пример; вы можете добиться гораздо большего с помощью петель.

В этом руководстве основное внимание уделяется forциклу JavaScript . Вы узнаете о других типах петель в следующих уроках.

JavaScript для цикла

Синтаксис forцикла:

  for(initialExpression; condition; updateExpression) ( // for loop body )

Вот,

  1. InitialExpression инициализирует и / или объявляются переменные и выполняет только один раз.
  2. Состояние оценивается.
    • Если условие есть false, forцикл прекращается.
    • если условие - trueвыполняется блок кода внутри forцикла.
  3. UpdateExpression обновляет значение initialExpression , когда условие true.
  4. Состояние оценивается процесс again.This продолжается до тех пор , пока условие false.

Чтобы узнать больше об условиях , посетите JavaScript-операторы сравнения и логические операторы.

Блок-схема цикла JavaScript for

Пример 1: отображение текста пять раз

 // program to display text 10 times const n = 5; // looping from i = 1 to 5 for (let i = 1; i <= n; i++) ( console.log(`I love JavaScript.`); )

Вывод

Я люблю JavaScript. Я люблю JavaScript. Я люблю JavaScript. Я люблю JavaScript. Я люблю JavaScript.

Вот как работает эта программа.

Итерация Переменная Условие: i <= n Действие
1-й i = 1
n = 5		 true Я люблю JavaScript. печатается.
i увеличивается до 2 .
2-й i = 2
n = 5		 true Я люблю JavaScript. печатается.
i увеличивается до 3 .
3-й i = 3
n = 5		 true Я люблю JavaScript. печатается.
i увеличивается до 4 .
4-й i = 4
n = 5		 true Я люблю JavaScript. печатается.
i увеличивается до 5 .
5-й i = 5
n = 5		 true Я люблю JavaScript. печатается.
i увеличивается до 6 .
Шестой i = 6
n = 5		 false Цикл завершен.

Пример 2: отображение чисел от 1 до 5

 // program to display numbers from 1 to 5 const n = 5; // looping from i = 1 to 5 // in each iteration, i is increased by 1 for (let i = 1; i <= n; i++) ( console.log(i); // printing the value of i )

Вывод

 1 2 3 4 5

Вот как работает эта программа.

Итерация Переменная Условие: i <= n Действие
1-й i = 1
n = 5		 true 1 напечатан.
i увеличивается до 2 .
2-й i = 2
n = 5		 true 2 напечатано.
i увеличивается до 3 .
3-й i = 3
n = 5		 true 3 напечатано.
i увеличивается до 4 .
4-й i = 4
n = 5		 true 4 напечатано.
i увеличивается до 5 .
5-й i = 5
n = 5		 true 5 напечатано.
i увеличивается до 6 .
Шестой i = 6
n = 5		 false Цикл завершен.

Пример 3: отображение суммы n натуральных чисел

 // program to display the sum of natural numbers let sum = 0; const n = 100 // looping from i = 1 to n // in each iteration, i is increased by 1 for (let i = 1; i <= n; i++) ( sum += i; // sum = sum + i ) console.log('sum:', sum);

Вывод

 сумма: 5050

Здесь значение суммы изначально равно 0 . Затем forцикл повторяется от i = 1 to 100. На каждой итерации к сумме добавляется i, а его значение увеличивается на 1 .

Когда i становится 101 , условие проверки - falseи сумма будет равна 0 + 1 + 2 +… + 100.

Вышеупомянутая программа для сложения суммы натуральных чисел также может быть записана как

 // program to display the sum of n natural numbers let sum = 0; const n = 100; // looping from i = n to 1 // in each iteration, i is decreased by 1 for(let i = n; i>= 1; i-- ) ( // adding i to sum in each iteration sum += i; // sum = sum + i ) console.log('sum:',sum);

Эта программа также дает тот же результат, что и Пример 3 . Вы можете выполнять одну и ту же задачу разными способами в программировании; программирование - это все о логике.

Хотя оба способа верны, вы должны попытаться сделать свой код более читабельным.

JavaScript бесконечный цикл for

Если условие проверки в forцикле всегда true, оно выполняется бесконечно (пока память не заполнится). Например,

 // infinite for loop for(let i = 1; i> 0; i++) ( // block of code )

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

В следующем уроке вы узнаете о whileи do… whileпетли.

Интересные статьи...