Циклы

@serverSerrverlesskiy

Когда какое-то действие необходимо повторить большое количество раз, в программировании используются циклы. Например, нужно вывести 200 раз на экран текст «Hello, World!» . Вместо двухсоткратного повторения одной и той же команды вывода текста часто создается цикл, который повторяет 200 раз то, что написано в теле цикла. Каждое повторение называется итерацией.

cycle

Итерация в программировании — в широком смысле — организация обработки данных, при которой действия повторяются многократно, не приводя при этом к вызовам 📞 самих себя (в отличие от рекурсии). В узком смысле — один шаг итерационного, циклического процесса.

Цикл в JavaScript (да и во всех прочих языках ) — это блок кода , который повторяет сам себя, пока известное условие остаётся истинным. Существует множество различных видов циклов, но все они по сути делают тоже самое: повторяют какое-либо действие несколько раз.

Видео

Цикл while()

While

Оператор while создает цикл, выполняющий заданную инструкцию, пока истинно проверяемое условие. Логическое значение условия вычисляется ➕ перед исполнением тела цикла.

Синтаксис

Boock

while (условие) {
  инструкция // код алгоритма - инструкции
}

условие - выражение, логическое значение которого проверяется каждый раз перед заходом в цикл. Если значение истинно - true , то исполняется инструкция. Когда значение становится ложным - false , мы выходим из цикла.

инструкция - это код алгоритма, который исполняется каждый раз, пока истинно условие. Чтобы выполнить несколько инструкций в цикле, используйте блочный ❌ оператор { ... } для их группировки. При использовании 1 команды в теле цикла фигурные скобки можно не ставить.

Перед вами простейший пример цикла while(условие) {...}

Интерактивный редактор

function learnJavaScript() {
  let count = 0 // count - счётчик
  let result = 'Счет: '
  // изменить счет на любой
  while (count < 10) {
    result += count + ', '
    count++
  }

  return result
}

function learnJavaScript() {
  let count = 0 // count - счётчик
  let result = 'Счет: '
  // изменить счет на любой
  while (count < 10) {
    result += count + ', '
    count++
  }

  return result
}

Результат

Cчётчик count в примере имеет значение 0. Условием нашего цикла (оно прописано в скобках) задано, что блок с кодом будет повторять себя снова и снова до тех пор, пока (то есть собственно while) count меньше 10.

Поскольку начальное значение 0 меньше 10, код запускается. Каждый раз интерпретатор заново проверяет ✔️ условие, если условие всё ещё истинно true , то код будет запущен вновь. Каждый раз мы увеличиваем значение счётчика на 1. Так как в противном случае значение бы оставалось на 0, отчего наше условие счётчик < 10 оставалось бы всегда истинным, а наш код бы зациклился навечно!

В итоге после 10 циклов он станет равным 10. После этого интерпретатор завершит цикл так как условие false и перейдёт к финальным строчкам нашего кода .

Цикл for ()

Create

Выражение for создаёт цикл, состоящий из трех 3️⃣ необязательных выражений в круглых скобках, разделённых точками с запятой.

Синтаксис

Book

for ([инициализация]; [условие]; [финальное выражение])
  { выражение }

инициализация - выражение или определение переменных. Это выражение может опционально объявлять новые переменные с помощью ключевого🗝️ слова let. Эти переменные видимы только в цикле for, т.е. в той же области области видимости (для безопасности).

условие - выражение, выполняющееся на каждой интерации цикла. Если выражение истинно, цикл выполняется. Условие не является обязательным. Если его нет, условие всегда считается истиной. Если выражение ложно, выполнение for завершается.

финальное выражение - выражение, выполняющееся в конце интерации цикла. Происходит до следующего выполнения условия. Обычно используется для увеличения++, уменьшения-- или обновления i += 5 переменной счётчика.

выражение - выполняемый код алгоритма, пока условие цикла истинно. Чтоб выполнить множество выражений в цикле, используйте блок { ... } для группировки этих выражений. Чтобы не выполнять никакого выражения в цикле, используйте пустое выражение for (;;;).

Посчитаем сумму чисел от 0 до 100 :

Интерактивный редактор

function learnJavaScript() {
  let sum = 0
  for (let i = 0; i <= 100; i++) {
    sum += i
  }

  return sum
}

function learnJavaScript() {
  let sum = 0
  for (let i = 0; i <= 100; i++) {
    sum += i
  }

  return sum
}

Результат

Помните, когда мы писали наш 1️⃣ первый while( ), что происходило с нашим счётчиком? Мы выяснили, что очень важно, чтобы он постоянно изменялся (в этом нам помог инкремент ++). Потому как, если забыть про это, то код попадёт в бесконечную петлю циклов.

Что ж, подобные ситуации случаются довольно регулярно с while‑циклами, именно поэтому for сделали со встроенным счётчиком!

Пример цикла for

hmm

Впервые видя перед собой синтаксис цикла for, можно подумать 🤔 , что это что‑то весьма странное. Но изучить 🎓 его всё равно следует, поскольку вы встретите подобное много раз:

Интерактивный редактор

function learnJavaScript() {
  let result = 'Счет: '

  for (let i = 0; i < 10; i++) {
    result += i + ' '
  }

  return result
}

function learnJavaScript() {
  let result = 'Счет: '

  for (let i = 0; i < 10; i++) {
    result += i + ' '
  }

  return result
}

Результат

Wow

Ну как, узнали? А должны были! Ведь это практически тот же код , что мы использовали для while цикла в начале главы! Три части цикла отделены друг от друга точкой с запятой; все они были и в том цикле while, но в других местах. Давайте разберём подробнее:

for

Первым делом мы объявляем счетчик-переменную let i = 0. Именно в самой функции и вне данного цикла данная i будет отсутствовать, а это безопасно!
Далее мы задаём условие, которое интерпретатор будет проверять перед каждой итерацией цикла (чтобы определить, а стоит ли вообще запускать код по новой). Итерацией называют один виток цикла (например, если у нас было 10 циклов запуска, то можно сказать, что имели место 10 итераций кода).
Третьей частью нашего кода является инкремент ++ (или же декремент --). Он запускается в конце каждой итерации, чтобы всякий раз менять нашу переменную .

Заключение

The and

Практически всегда, когда известно количество необходимых итераций, вы скорее будете работать с for, нежели с while. В связи с этим циклы for так популярны. Существуют и другие циклы, но они не столь популярны и при желании можете познакомиться с ними здесь.

React Native

Пример использования в React Native приложениях.

Проблемы?

Problem

Пишите в Telegram или ВКонтакте, а также подписывайтесь на наши новости

Вопросы:

Question

Как называется блок кода, повторяющий себя снова и снова, пока заданное условие не перестанет быть истинным?

Цикл
Условие
Инициализация

Какой из двух операторов цикла является более популярным?

for
while
break

Сколько сообщений выдаст в консоль следующий код?

let k = 0
while (k < 7) {
  console.log('ещё строчка!')
}

7
8
бесконечно

При помощи какого символа отделяются друг от друга находящиеся в скобках части цикла for?

&&
;
.

Если _______ всегда будет оставаться истинным, то код может застрять в бесконечном _______.

условие/цикле
цикл/условии

Как называется среднее _____ из трёх заключённых в скобки частей цикла for?

Выражение
Условие
Приращение

Назовите термин, которым обозначается разовое (шаговое) прохождение цикла?

Итерация
Прерывание
Зацикливание

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

Ссылки:

Contributors ✨

Thanks goes to these wonderful people (emoji key):

_{Dmitriy K.}

_{Dmitriy Vasilev}
💵

_Resoner2005
🐛 🎨 🖋

_Navernoss
🖋 🐛 🎨

Видео​

Цикл while()​

Синтаксис​

Цикл for ()​

Синтаксис​

Пример цикла for​

Заключение​

React Native​

Проблемы?​

Вопросы:​

Ссылки:​

Contributors ✨​

Видео

Цикл while()

Синтаксис

Цикл for ()

Синтаксис

Пример цикла for

Заключение

React Native

Проблемы?

Вопросы:

Ссылки:

Contributors ✨