Циклы обычно используются в алгоритмических задачах JavaScript. Хотя они затратны по времени, они позволяют быстро выполнить блок кода n количество раз.

Существует несколько видов петель:

  • for — перебирает блок кода nколичество раз
  • for/in — перебирает свойства объекта.
  • for/of — перебирает значения итерируемого объекта.
  • while — перебирает блок кода пока выполняется условие
  • do/while — то же, что и выше

Наиболее распространенными являются циклы for и циклы while. Я пройдусь по каждому из них!

Давайте начнем.

1. Цикл for

Цикл for проходит через блок кода n количество раз. Это наиболее часто используемый тип петли.

for (statement1; statement2; statement3) {
    // block of code
}

statement1 выполняется один раз перед выполнением блока кода. Как правило, вы устанавливаете здесь переменную (например, i = 0) перед запуском цикла.

statement2 — это условный оператор для выполнения блока кода.

statement3 выполняется после каждого цикла кодового блока.

let count;
for (i = 0; i < 5; i++) {
    count += i 
};
console.log("The count is " + count);
//=> The count is 10

В этом примере цикл увеличивает число count на i до тех пор, пока условное выражение не станет истинным, после чего цикл завершится.

2. для/в цикле

Цикл for/in перебирает свойства объекта.

let example = {first: "Esther", last: "Kang"};
let name;
let x;
for (x in example) {
    name += example[x]
}
console.log("My name is " + example")
//=> My name is Esther Kang

3. для/из петли

Цикл for/of перебирает значения итерируемого объекта (т. е. массивы, строки, карты, списки узлов и т. д.).

let fruits = ["mangoes", "strawberries", "pineapples"];
let x;
for (x of fruits) {
    document.write(x + " ,") 
}

4. пока цикл

Цикл while проходит через блок кода пока условие истинно.

while (condition) {
    // code block
};

Довольно понятно. Пока условие истинно, выполните этот блок кода.

let fruits = ["mangoes", "strawberries", "pineapples", "bananas"];
let i = 0;
let text = "My favorite fruits are: ";
while (i < fruits.length) {
    text += fruits[i] + ", "
}
console.log(text);
//=> My favorite fruits are mangoes, strawberries, pineapples, bananas

5. делать/пока цикл

Цикл do/while делает то же самое, что и обычный цикл while, но с небольшим отличием.

do { 
    code block
} while (conditional statement);

Цикл do/while всегда будет выполняться по крайней мере один раз (даже если условие ложно), перед проверкой истинности условного оператора, который затем будет выполнять цикл до тех пор, пока оператор верен.

let i = 0;
let number;
do { 
    number += i 
    i++
} while (i < 5);
console.log("The number is " + number);
//=> The number is 10

И это основы каждого оператора цикла!

Имейте в виду — циклы увеличивают время выполнения функции. Вы также можете вкладывать циклы в циклы, что приведет к экспоненциальному увеличению времени выполнения, то есть… держитесь подальше от вложенных циклов, если они вам абсолютно не нужны!