Главная » Электронные кошельки » Циклы. Циклы в JavaScript

Циклы. Циклы в JavaScript

Циклы предназначены для многократного выполнения одних и тех же инструкций.

На языке JavaScript существует 4 вида циклов:

Цикл for . Этот цикл используется, когда известно точное количество повторений одних и тех же инструкций.
Цикл while . Он предназначен для выполнения одних и тех же инструкций до тех пор, пока заданное условие истинно.
Цикл do...while . Данный цикл аналогичен циклу while , но условие проверяется не перед выполнением повторяющихся инструкций, а после них. Таким образом, в отличие от цикла while , даже если условие изначально ложное, инструкции выполнятся хотя бы один раз.
Цикл for...in . Он применяется, когда необходимо перебрать все свойства в объекте или каждый элемент в массиве.

Цикл for

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

For (инициализация; условие; финальное выражение) { /* тело цикла */ }

инициализация - это выражение, которое выполняется один раз перед выполнением цикла; обычно используется для инициализации счётчика;
условие - это выражение, истинность которого проверяется перед каждой итерацией; если выражение вычисляется как истина, то выполняется итерация, в противном случае цикл for завершает работу;
финальное выражение - это выражение, которое выполняется в конце каждой итерации; обычно используется для изменения счетчика;
тело цикла - инструкции, выполнение которых нужно повторять.

Рассмотрим пример цикла, который выведет в консоль числа от 1 до 9:

Var i; // Цикл for от 1 до 9, с шагом 1 for (i = 1; i 4) { console.log(j); j -= 1; if ((j % 2) != 0) { continue checkj; } console.log(j + " чётное."); } console.log("i = " + i); console.log("j = " + j); }

for...in

Оператор for...in проходит по всем перечислимым свойствам объекта. JavaScript выполнит указанные выражения для каждого отдельного свойства. Цикл for...in выглядит так:

For (variable in object) { выражения }

Пример

Следующая функция берёт своим аргументом объект и его имя. Затем проходит по всем свойствам объекта и возвращает строку, которая содержит имена свойств и их значения.

Function dump_props(obj, obj_name) { var result = ""; for (var i in obj) { result += obj_name + "." + i + " = " + obj[i] + "
"; } result += ""; return result; }

Для объекта car со свойствами make и model , результатом будет :

Car.make = Ford car.model = Mustang

Пример №2

Также, по ключу можно выводить значение:

Let obj = {model: "AUDI A8", year: "2019", color: "brown"} for (key in obj) { console.log(`${key} = ${obj}`); } // model = AUDI A8 // year = 2019 // color = brown

Массивы

Хотя, очень заманчиво использовать for...in как способ пройтись по всем элементам Array , этот оператор возвращает имя свойств определённых пользователем помимо числовых индексов. Таким образом лучше использовать стандартный for для числовых индексов при взаимодействии с массивами, поскольку оператор for...in проходит по определённым пользователем свойствам в дополнение к элементам массива, если вы изменяете массив, например, добавляете свойства и методы.

For (variable of object ) { выражения }

Следующий пример показывает разницу между циклами for...of и for...in . Тогда как for...in проходит по именам свойств, for...of проходит по значениям свойств:

Let arr = ; arr.foo = "hello"; for (let i in arr) { console.log(i); // выводит "0", "1", "2", "foo" } for (let i of arr) { console.log(i); // выводит "3", "5", "7" }

Очень часто нужно, чтобы определённая часть программы выполнялась много раз. Разумеется, можно просто сделать так: скопировать-вставить и так нужное число раз. Однако, это абсурдно, особенно, если действие надо выполнять, например, 1000 раз. Поэтому существуют так называемые циклы , которую присутствуют в большинстве языков программирования. И о них я Вам и расскажу.

Содержит определённый код, который прокручивается многократно. Существует несколько видов циклов: for , while и do-while .

Начнём с самого первого цикла (и самого популярного) - цикла for . Общий вид этого цикла таков:

For (переменная_итерации = начальное_значение; условие; действие_после_каждой_итерации) {
//код программы
}

Давайте прокомментирую то, что здесь написано. Вначале идёт - переменная итерации . Это обычное имя переменной для итерации. Дальше идёт начальное_значение . Собственно, название говорит само за себя. Дальше идёт условие, при выполнении которого (то есть возвращается true ) цикл запускается ещё один раз, и, наконец, действие, которое выполняется после каждой итерации. Как правило, это изменение переменной для итерации.

Давайте с Вами напишем простой скрипт, который будет выводить количество итераций цикла:

For (i = 0; i < 100; i++)
document.write(i + " ");

Здесь мы задали переменную для итерации (называется i ), которой присвоили значение 0 . Дальше проверяется условие: i < 100 . Если оно выполняется, то выполняется одна итерация цикла. После выполнения каждой итерации происходит i++ (то есть увеличение переменной i на 1 ). Снова проверяется условие, и если оно истинно, то выполняется ещё одна итерация. И так до тех пор, пока условие i < 100 не станет ложным. Очевидно, что оно будет ложно лишь через 100 итераций. Таким образом, данный цикл будет выполняться 100 раз, что мы можем увидеть, если запустим этот скрипт. И ещё кое-что. Так как у нас здесь выполняется всего один оператор (document.write() ), то наличие фигурных скобок необязательно. Если у Вас 2 и более операторов крутятся в цикле, то тогда необходимо их поставить.

Теперь поговорим о второй разновидности циклов в JavaScript - while . В принципе, цикл очень похож на for (хотя все циклы похожи). Но здесь общий вид другой:

While (условие) {
//код программы
}

Как видите, здесь нет ни переменной для итерации, ни каких-либо действий после итерации. Отсюда следует вывод: чтобы выйти из цикла необходимо в самом цикле сделать так, чтобы "условие " стало ложным. Если это не сделать, то произойдёт зацикливание, а, следовательно, Ваш скрипт повиснет.

Давайте реализуем такую же задачу, как и раньше, но используя цикл while .

Var i = 0;
while (i < 100) {
i++;
document.write(i + " ");
}

Перед началом цикла мы создали переменную i , которой присвоили начальное значение. Затем перед запуском цикла проверяется условие, и если оно истинно, то запускается итерация цикла, в которой мы увеличиваем переменную для итерации (иначе произойдёт зацикливание). И выводим эту переменную.

И, наконец, последний вид циклов в JavaScript - цикл do-while . Синтаксис такой:

Do {
//код программы
} while (условие)

Очень похож на цикл while , однако, здесь есть всего одно, но очень принципиальное отличие. Если цикл while сначала проверяет условие, а потом уже выполняет или нет итерацию. То цикл do-while сначала именно выполняет итерацию, и только потом проверяет условие. И если оно ложно, то выходит из цикла. Другими словами, независимо от условия данный цикл гарантированно выполнится хотя бы 1 раз. Думаю, что данный код будет излишним, но всё же.

Var i = 0;
do {
i++;
document.write(i + " ");
} while (i < 100)

Пояснять код не буду, уверен, Вы из без меня с ним разберётесь. Поэтому я лучше перейду к двум интересным операторам: break и continue .

Начнём с break . Данный оператор позволяет досрочно выскочить из цикла. Давайте с Вами напишем такой код:

For (i = 0; i < 100; i++) {
if (i == 50) break;
document.write(i + " ");
}

Вы можете запустить этот скрипт и обнаружите, что вывелись только числа до 49 , так как при i = 50 цикл прервался, благодаря оператору break .

Теперь рассказываю об операторе continue . Данный оператор позволяет перейти к следующей итерации цикла. Чтобы не расписывать здесь много, лучше сразу покажу пример:

For (i = 0; i < 100; i++) {
if (i == 50) continue;
document.write(i + " ");
}

Если Вы запустите этот скрипт, то увидите, что не хватает числа 50 . Это произошло потому, что при i = 50 , мы переходим к следующей итерации цикла, перед которой i увеличивается на 1 и становится равным 51-му .

Вот, вроде бы, и всё, что хотелось написать о циклах JavaScript . Надеюсь, Вам всё стало ясно. Можете также придумать себе какую-нибудь задачу и решить её. Это будет великолепной тренировкой.

Просмотров