Цикл for
For — это оператор в JavaScript для создания цикла, который состоит из трёх необязательных условий. Цикл for считается более сложным чем while , но тем не менее более распространен.
Синтаксис for
for (начальное выражение; условие; шаг) < // инструкция (тело цикла) > Начальное выражение — условие выполняется один раз при входе в цикл и обычно используется для инициализации счетчика.
Условие — проверяется при каждой итерации. Если условие true происходит запуск цикла, при false остановка.
Тело цикла — код из тела цикла выполняется при каждой итерации до тех пор пока условие true .
Шаг — выражение выполняется после исполнения кода из тела цикла при каждой итерации перед проверкой условия.
Пример №1
for (let n = 0; n
let n = 0 — выполняется один раз при входе в цикл, переменной n задается значение 0.
n — далее проверяется условие, где n должно быть меньше 5, если это true , тогда поток выполнения кода идет дальше.
console.log(n) — после каждой итерации в console выводится значение переменной n , на первом этапе это 0.
n++ — после выполнения тела цикла n увеличивается на единицу.
Далее процесс происходит заново, до тех пор пока n не станет равна 5, тогда цикл завершится. Результатом скрипта является вывод в console цифр 0, 1, 2, 3, 4.
Пример №2
for (let i = 1, n = 0; i
В первом выражении цикла for можно объявить несколько переменных, в этом примере это i и n , но их может быть и больше. В третьем выражении ситуация сходная с каждым шагом i и n увеличиваются на единицу, при необходимости можно добавить операции и над другими переменными.
Необязательные элементы в цикле for
Все три выражения в цикле for расположенные в круглых скобках необязательны и могут быть пропущены.
Пример №3
let n = 0; for (; n
Такой код отработает идентично, тому, где переменная n была бы объявлена в первом выражении for , а не перед циклом.
Пример №4
let n = 0; for (; n
В этом случае шаг был перенесен в тело цикла.
Пример №5
let n = 0; for (; ; )
Здесь отсутствуют все три выражения и это тоже не ошибка, правда это делает цикл бесконечным. В таком случае можно предусмотреть окончание цикла с помощью директивы break.
Прерывание цикла — break
Директива break позволяет прервать цикл for в любой момент
Пример №6
let n = 0; for (; ; ) < console.log(n++); if (n >10) break; > При каждой итерации в теле цикла происходит проверка if (n > 10) и когда n станет больше 10, цикл прервется.
Пример №7
for (var n = 0; n < 8; n++) < if (n === 5) break; >alert(n); Здесь более наглядно можно увидеть принцип работы break . Как только n достигнет пяти, цикл прервется и в модальном окне появится результат. В свою очередь условие n будет проигнорировано.
Завершение текущей итерации — continue
Директива continue применяется в том случае, если необходимо прервать не весь цикл, а одну или более итераций.
Пример №8
for (let n = 0; n
Данный скрипт будет выводить по порядку в модальном окне только нечетные числа, когда попадается четное число, срабатывает continue , который завершает данную итерацию.
Метки для continue и break
При вложенности циклов директивы continue и break , могут не помочь решить нужную задачу, в этом случае на помощь приходят метки. Допустим необходимо при определенных условиях выйти из всех уровней цикла.
Пример №9
let n, i; cancelLoops: for (n = 0; n < 4; n++) < for (i = 0; i < 4; i++) < if (n === 3 && i === 3) < break cancelLoops; >console.log('n = ' + n + ', i = ' + i); > > Метка cancelLoops обозначает верхний цикл и при достижении условия (n === 3 && i === 3) команда break cancelLoops его прерывает
Пример №10
passLoop: for (n = 0; n < 4; n++) < for (i = 0; i < 4; i++) < if (n === 2 && i === 2) < continue passLoop; >console.log('n = ' + n + ', i = ' + i); > > При достижении условия (n === 2 && i === 2) команда continue passLoop завершает текущую итерацию и переносит поток выполнения кода в начало верхнего цикла.
Итого
Цикл for состоит из трех необязательных выражений и тела цикла. Для того, чтобы прервать исполнение for используется команда break , для окончания итерации continue . При работе с вложенными циклами можно решать задачи с помощью меток, которые работают, как с continue , так и с break .
Skypro — научим с нуля
Циклы while и do. while
while — это оператор в JavaScript, позволяющий воспроизводить цикл, который выполняет задачу столько раз, пока истинно заданное условие. while чаще используется, когда количество итераций заранее неизвестно.
Синтаксис while
while (условие) < // инструкция (тело цикла) > Условие проверяется перед каждым заходом в цикл, если логическое значение верно, выполняется инструкция , в противном случае следующий на циклом while код.
Инструкция выполняется столько раз, сколько раз на входе в цикл условие было истинно.
Пример №1
Цикл выводит модальное окно со значением n до тех пор пока n не будет меньше 4
let n = 0; while (n < 4) < alert("n n num num n n 2">Цикл do. while Единственное отличие цикла do…while от while это то, что проверка условия происходит после выполнения тела цикла. Таким образом инструкция будет выполнена, как минимум один раз.
Синтаксис do. while
do < // инструкция (тело цикла) >while (условие);
Инструкция выполнится, как минимум один раз и будет повторятся до тех пор пока условие истинно. Если тело цикла состоит из одной строки фигурные скобки можно не ставить.
Условие проверяется после выполнения инструкции, если истинно тогда запускается еще одна итерация, в противном случае выполняется код следующий за циклом do…while
Пример №6
let result = ''; let n = 0; do < n = n + 1; result = result + n; console.log("result Напишите ваше имя"); >while (!yourName); console.log(yourName);
Программа создает модальное окно, в котором просит написать имя и далее выводит его в console.
Прерывание цикла - break
Выход из while при условии false не единственный способ прекратить цикл. С помощью директивы break мы можем завершить замкнутый цикл в любой момент.
Пример №8
let n = 0; while (n < 12) < if (n === 4) < break; >n = n + 1; > alert(n);
Без if с break цикл работал бы до тех пор пока условие было бы истинным, в нашем случае while прервался когда n стал равен 4.
while в сочетании с инструкцией break это отличное решение, когда условие при котором нужно завершить бесконечный цикл находится не в начале или конце, а где-то посередине или может находится в нескольких местах.
Завершение текущей итерации - continue
Если необходимо прервать не весь цикл, а только одну итерацию при определенных условиях - используют дерективу continue . В while она переносит поток выполнения к условию.
Пример №9
a = 0; b = 0; while (a < 10) < a++; if (a === 5) < continue; >b += a; console.log("b 5">Метки для continue и break Если циклы вложены друг в друга директивы continue и break могут не решать нужную задачу без помощи меток. Например при определенных условиях нам нужно выйти из всех уровней цикла.
Пример №10
let a = 0; let b = 0; cancelLoops: while (true) < console.log('Outer loops: ' + a); a += 1; b = 1; while (true) < console.log('Inner loops: ' + b); b += 1; if (b === 8 && a === 5) < break cancelLoops; >else if (b === 8) < break; >> >
break cancelLoops - выход из внешнего цикла
В этом примере при a = 5 и b = 8 мы переходим к завершению внешнего цикла while. Если a не равно 5 происходит выход из внутреннего цикла.
Пример №11
В данном уроке мы рассмотрели циклы while и do…while , которые различаются между собой только моментом проверки условия. while проверяет перед каждой итерацией, do…while после выполнения тела цикла.
Циклы while и do…while могут быть прерваны если проверяемое условие false и задействована директива break .
Итерация может быть прервана с помощью директивы continue .
continue и break поддерживают метки, которые дают возможность выйти за пределы цикла.
Skypro - научим с нуля
JavaScript: Цикл While
Программы, которые мы пишем, становятся всё сложнее и объемнее. Они все ещё очень далеки от реальных программ, где количество строк кода измеряется десятками и сотнями тысяч (а иногда и миллионами), но текущая сложность уже способна заставить напрячься людей без опыта. Начиная с этого урока, мы переходим к одной из самых сложных базовых тем в программировании – циклам.
Любые прикладные программы служат очень прагматичным целям. Они помогают управлять сотрудниками, финансами, развлекают в конце концов. Несмотря на различия, все эти программы выполняют заложенные в них алгоритмы, которые очень похожи между собой. Что это такое? Алгоритм — это последовательность действий (инструкций), которая приводит нас к некоему ожидаемому результату. В принципе, это описание подходит под любую программу, но под алгоритмами обычно понимается что-то более специфичное.
Представьте себе, что у нас есть книга и мы хотим найти внутри неё какую-то конкретную фразу. Саму фразу мы помним, но не знаем, на какой она странице. Как найти нужную страницу? Самый простой (и долгий) способ — последовательно просматривать страницы до тех пор, пока мы не найдем нужную. В худшем случае придется просмотреть все страницы, но результат мы всё равно получим. Именно этот процесс и называется алгоритмом. Он включает в себя логические проверки (нашли ли фразу) и перебор страниц. Количество страниц, которое придется посмотреть, заранее неизвестно, но сам процесс просмотра повторяется из раза в раз совершенно одинаковым образом. Для выполнения повторяющихся действий как раз и нужны циклы. Каждый повтор, в таком случае, называется итерацией.
Допустим мы хотим написать функцию, которая выводит на экран все числа от 1 до указанного (через аргументы):
printNumbers(3); // => 1 // => 2 // => 3
Эту функцию невозможно реализовать уже изученными средствами, так как количество выводов на экран заранее неизвестно. А с циклами это не составит никаких проблем:
const printNumbers = (lastNumber) => < // i сокращение от index (порядковый номер) // используется по общему соглашению во множестве языков // как счетчик цикла let i = 1; while (i console.log('finished!'); >; printNumbers(3);
1 2 3 finished!
В коде функции использован цикл while . Он состоит из трёх элементов:
- Ключевое слово while . Несмотря на схожесть с вызовом функций, это не вызов функции.
- Предикат. Условие, которое указывается в скобках после while . Это условие вычисляется и проверяется перед выполнением тела цикла на каждой итерации.
- Тело цикла. Блок кода в фигурных скобках. Этот блок аналогичен блоку кода в функциях. Всё, что определено внутри этого блока (константы или переменные), видно только внутри этого блока.
// Инициализируется i let i = 1; // Предикат возвращает true, поэтому выполняется тело цикла while (1
Самое главное в цикле — завершение его работы (выход из цикла). Процесс, который порождает цикл, должен в конце концов остановиться. Ответственность за остановку полностью лежит на программисте. Обычно задача сводится к введению переменной, называемой «счётчиком цикла». Сначала счётчик инициализируется, то есть ему задаётся начальное значение. В нашем примере это инструкция let i = 1 , выполняемая до входа в цикл. Затем в условии цикла проверяется, достиг ли счётчик своего предельного значения. И, наконец, счётчик меняет свое значение i = i + 1 .
На этом моменте новички делают больше всего ошибок. Например, случайно забытое увеличение счётчика или неправильная проверка в предикате способны привести к зацикливанию. Это ситуация, при которой цикл работает бесконечно и программа никогда не останавливается. В таком случае приходится её завершать принудительно (кто знает, может быть когда зависают реальные программы, в этот момент внутри них выполняется бесконечный цикл).
const printNumbers = (lastNumber) => < let i = 1; // Этот цикл никогда не остановится // и будет печатать всегда одно значение while (i console.log('finished!'); >;
В некоторых случаях бесконечные циклы полезны. Здесь мы такие случаи не рассматриваем, но полезно видеть как выглядит этот код:
while (true) < // Что-то делаем >
Подводя итог. Когда всё же нужны циклы, а когда можно обойтись без них? Физически невозможно обойтись без циклов тогда, когда алгоритм решения задачи требует повторения каких-то действий, как в примере с книгой, и количество этих операций заранее неизвестно.
Задание
Модифицируйте функцию printNumbers() так, чтобы она выводила числа в обратном порядке. Для этого нужно идти от верхней границы к нижней. То есть счётчик должен быть инициализирован максимальным значением, а в теле цикла его нужно уменьшать до нижней границы.
printNumbers(4);
4
3
2
1
finished!
Упражнение не проходит проверку — что делать? ��
Если вы зашли в тупик, то самое время задать вопрос в «Обсуждениях». Как правильно задать вопрос:
- Обязательно приложите вывод тестов, без него практически невозможно понять что не так, даже если вы покажете свой код. Программисты плохо исполняют код в голове, но по полученной ошибке почти всегда понятно, куда смотреть.
В моей среде код работает, а здесь нет ��
Тесты устроены таким образом, что они проверяют решение разными способами и на разных данных. Часто решение работает с одними входными данными, но не работает с другими. Чтобы разобраться с этим моментом, изучите вкладку «Тесты» и внимательно посмотрите на вывод ошибок, в котором есть подсказки.
Мой код отличается от решения учителя ��
Это нормально ��, в программировании одну задачу можно выполнить множеством способов. Если ваш код прошел проверку, то он соответствует условиям задачи.
В редких случаях бывает, что решение подогнано под тесты, но это видно сразу.
Прочитал урок — ничего не понятно ��
Создавать обучающие материалы, понятные для всех без исключения, довольно сложно. Мы очень стараемся, но всегда есть что улучшать. Если вы встретили материал, который вам непонятен, опишите проблему в «Обсуждениях». Идеально, если вы сформулируете непонятные моменты в виде вопросов. Обычно нам нужно несколько дней для внесения правок.
Кстати, вы тоже можете участвовать в улучшении курсов: внизу есть ссылка на исходный код уроков, который можно править прямо из браузера.
Полезное
Определения
- Цикл While — инструкция для повторения кода, пока удовлетворяется какое-то условие.
Какой цикл проверяет условие после каждой итерации
(PHP 4, PHP 5, PHP 7, PHP 8)
Цикл do-while очень похож на цикл while , с тем отличием, что истинность выражения проверяется в конце итерации, а не в начале. Главное отличие от обычного цикла while в том, что первая итерация цикла do-while гарантированно выполнится (истинность выражения проверяется в конце итерации), тогда как она может не выполниться в обычном цикле while (истинность выражения которого проверяется в начале выполнения каждой итерации, и если изначально имеет значение false , то выполнение цикла будет прервано сразу).
Есть только один вариант синтаксиса цикла do-while :
$i = 0 ;
do echo $i ;
> while ( $i > 0 );
?>
В примере цикл будет выполнен ровно один раз, так как после первой итерации, когда проверяется истинность выражения, она будет вычислена как false ( $i не больше 0) и выполнение цикла прекратится.
Опытные пользователи С могут быть знакомы с другим использованием цикла do-while , которое позволяет остановить выполнение хода программы в середине блока, для этого нужно обернуть нужный блок кода вызовом do-while (0) и использовать break . Следующий фрагмент кода демонстрирует этот подход:
do if ( $i < 5 ) echo "i ещё недостаточно велико" ;
break;
>
$i *= $factor ;
if ( $i < $minimum_limit ) break;
>
echo "значение i уже подходит" ;
Можно использовать оператор goto вместо подобного "хака".
User Contributed Notes 6 notes
16 years ago
There is one major difference you should be aware of when using the do--while loop vs. using a simple while loop: And that is when the check condition is made.
In a do--while loop, the test condition evaluation is at the end of the loop. This means that the code inside of the loop will iterate once through before the condition is ever evaluated. This is ideal for tasks that need to execute once before a test is made to continue, such as test that is dependant upon the results of the loop.
Conversely, a plain while loop evaluates the test condition at the begining of the loop before any execution in the loop block is ever made. If for some reason your test condition evaluates to false at the very start of the loop, none of the code inside your loop will be executed.
8 years ago
Do-while loops can also be used inside other loops, for example:
// generating an array with random even numbers between 1 and 1000
$numbers = array();
$array_size = 10 ;
// for loop runs as long as 2nd condition evaluates to true
for ( $i = 0 ; $i < $array_size ; $i ++)
// always executes (as long as the for-loop runs)
do <
$random = rand ( 1 , 1000 );
// if the random number is even (condition below is false), the do-while-loop execution ends
// if it's uneven (condition below is true), the loop continues by generating a new random number
> while (( $random % 2 ) == 1 );
// even random number is written to array and for-loop continues iteration until original condition is met
$numbers [] = $random ;
>
// sorting array by alphabet
echo '
' ;
print_r ( $numbers );
echo '
' ;
?>
2 years ago
The example below first sets a variable $x to 1 ($x = 1). Then, the do while loop will write some output, and then increment the variable $x with 1. Then the condition is checked (is $x less than, or equal to 5?), and the loop will continue to run as long as $x is less than, or equal to 5:
15 years ago
I'm guilty of writing constructs without curly braces sometimes. writing the do--while seemed a bit odd without the curly braces (< and >), but just so everyone is aware of how this is written with a do--while.
a normal while:
while ( $isValid ) $isValid = doSomething ( $input );
?>
a do--while:
do $isValid = doSomething ( $input );
while ( $isValid );
?>
Also, a practical example of when to use a do--while when a simple while just won't do (lol). copying multiple 2nd level nodes from one document to another using the DOM XML extension
# open up/create the documents and grab the root element
$fileDoc = domxml_open_file ( 'example.xml' ); // existing xml we want to copy
$fileRoot = $fileDoc -> document_element ();
$newDoc = domxml_new_doc ( '1.0' ); // new document we want to copy to
$newRoot = $newDoc -> create_element ( 'rootnode' );
$newRoot = $newDoc -> append_child ( $newRoot ); // this is the node we want to copy to
# loop through nodes and clone (using deep)
$child = $fileRoot -> first_child (); // first_child must be called once and can only be called once
do $newRoot -> append_child ( $child -> clone_node ( true )); // do first, so that the result from first_child is appended
while ( $child = $child -> next_sibling () ); // we have to use next_sibling for everything after first_child
?>
5 years ago
If you put multiple conditions in the while check, a do-while loop checks these conditions in order and runs again once it encounters a condition that returns true. This can be helpful to know when troubleshooting why a do-while loop isn't finishing. An (illustrative-only) example:
$numberOne = 0 ;
do echo $numberOne ;
$numberOne ++;
> while( $numberOne < 5 || incrementNumberTwo () );
function incrementNumberTwo () echo "function incrementNumberTwo called" ;
return false ;
>
// outputs "01234function incrementNumberTwo called"
?>