#Циклы и итерации
Давайте поговорим о циклах и итерациях.
Итерация выполняется всякий раз, когда выполняется цикл.
Вспомните массив, который выглядит так
Предположим, мы хотим просмотреть все элементы массива имен и отобразить их по отдельности, мы будем использовать циклы или итерации, чтобы пройти их один за другим.
Позволяет вручную отображать каждое из имен,
Что, если бы у нас было около 100 имен? мы будем console.log 100 раз?. Нет. Мы используем петли.
###Цикл For
Синтаксис цикла for такой
Чтобы полностью понять возможности цикла for, давайте воспользуемся им для перебора массива.
for (let index = 0; index <= 3; index++){ console.log( index) // loop body } // 0,1,2,3,4,5,6
«То, что мы получаем, является индексом элементов». Это шаг ближе, давайте проанализируем, что здесь происходит:
#старт || индекс = 0:
Здесь начинается петля. Мы говорим, что когда цикл запускается в первый раз, значение индекса должно быть равно 0. Значение индекса всегда можно изменить. Индекс является переменной. Большинство людей используют «i».
#checkThisCondition || индекс ‹= 3:
Это сердце всего этого, мы называем это условием. Мы говорим, что тело цикла должно выполняться только тогда и только тогда, когда выполняется «это условие». В нашем случае цикл должен выполняться только в том случае, если значение индекса меньше или равно трем (3). Напомним, что значение индекса равно 0, так как же оно увеличивается до 3.
#increaseOrDecreseTheStart || индекс++ || индекс — :
Последний этап. Здесь мы увеличиваем или уменьшаем значение индекса на 1 (может быть любым значением). Это происходит только после выполнения условия и выполнения тела цикла.
При первом запуске в консоли мы видим 0.
Происходит увеличение, и значение индекса увеличивается на 1
for (let index = 1;index <= 3; index++){ console.log( index) }
и снова проверяется условие «если индекс, который сейчас равен 1, меньше или равен 3». Поскольку 1 меньше или равно 3, выполняется тело цикла. Консоль равна 1. Затем index снова увеличивается на 1. «index становится 2».
for (let index = 2; index <= 3; index++){ console.log( index) }
и снова проверяется условие «если индекс, который сейчас равен 2, меньше или равен 3». Поскольку 2 меньше или равно 3, выполняется тело цикла. Консоль равна 2. Затем индекс снова увеличивается на 1. Индекс становится равным 3.
for (let index = 3; index <= 3; index++){ console.log( index) }
и снова проверяется условие «если индекс, который сейчас равен 3, меньше или равен 3». Поскольку 3 меньше или равно 3, выполняется тело цикла. Консоль равна 3. Затем индекс снова увеличивается на 1. Индекс становится равным 4.
for (let index = 4; index <= 3; index++){ console.log( index) }
и снова проверяется условие «если индекс, который сейчас равен 4, меньше или равен 3». Поскольку 4 не меньше или равно 3, тело цикла не выполняется и процесс завершается.
В итоге получаем что-то вроде этого:
0 1 2 3
Теперь давайте пройдемся по нашему массиву имен и напечатаем их все по отдельности.
Напомним, что если у нас есть такой массив
const arrays =[‘milk’, ‘chocolate’]
Чтобы узнать длину этого массива, мы делаем
console.log(arrays.length) //2
Чтобы получить доступ к любому из элементов, мы используем их индекс.
console.log( arrays[0]) // milk console.log( arrays[1]) // chocolate
Имейте это в виду, мы будем использовать эту логику для доступа к массиву имен, используя их индекс и установив условие, используя длину массива минус 1.
Мощный!
#For..of цикла
Я называю этот цикл «цикл for с соусом».
В предыдущем цикле for я упомянул, что он обращается к индексам. Итак, для доступа к элементам мы применили некоторую логику
console.log( arrayNames[index] )
Цикл for… of дает нам гибкость прямого доступа к элементам без использования индексов. Сладкий.
Вот синтаксис
Давайте используем его в нашем массиве имен
Это все! гладкий.
#for…в цикле
Я называю это сокращением основного «цикла for». В том, что он возвращает индекс элементов массива, но с простым кодом.
Вот синтаксис
Простой!
Теперь выбор за вами, что использовать в своем проекте.
#Во время цикла
Здесь следует отметить, что цикл while проверяет условие перед выполнением тела цикла. После выполнения объект или субъект условия увеличивается или уменьшается на значение.
Вот синтаксис
while( theConditionToBeMet ){ // loop body; condition++ OR condition — }
Давайте развернем это в нашем массиве имен
#do while loop
Так же, как и цикл while, но он проверяет условие после выполнения тела цикла.
Вот синтаксис
let objectOfCondition = someDataType; do{ //body of the loop } while( theConditionToBeMet )
давайте посмотрим, как это работает
Вот и все циклы и итерации.