JavaScript & TypeScriptМодуль 1: Базовый синтаксис
Циклы
Повторение действий с помощью for, while и других циклов
Цель урока
В этом уроке ты научишься:
- Повторять код с помощью
forиwhile - Перебирать массивы и объекты
- Управлять циклом с помощью
breakиcontinue
Цикл for
Используется, когда известно количество повторений:
for (let i = 0; i < 5; i++) {
console.log(i);
}
// 0, 1, 2, 3, 4Структура:
let i = 0— начальное значениеi < 5— условие продолженияi++— шаг после каждой итерации
Цикл while
Выполняется, пока условие истинно:
let i = 0;
while (i < 5) {
console.log(i);
i++;
}
// 0, 1, 2, 3, 4Осторожно
Не забудь изменять переменную, иначе цикл будет бесконечным.
Цикл do...while
Выполняется минимум один раз:
let i = 10;
do {
console.log(i);
i++;
} while (i < 5);
// 10 (выполнится один раз)Перебор массива
Классический for
let fruits = ["яблоко", "банан", "апельсин"];
for (let i = 0; i < fruits.length; i++) {
console.log(fruits[i]);
}for...of (рекомендуется)
let fruits = ["яблоко", "банан", "апельсин"];
for (let fruit of fruits) {
console.log(fruit);
}Перебор объекта
for...in
let user = {
name: "Иван",
age: 25,
city: "Москва"
};
for (let key in user) {
console.log(key + ": " + user[key]);
}
// name: Иван
// age: 25
// city: Москваbreak и continue
break — выход из цикла
for (let i = 0; i < 10; i++) {
if (i === 5) {
break;
}
console.log(i);
}
// 0, 1, 2, 3, 4continue — пропуск итерации
for (let i = 0; i < 5; i++) {
if (i === 2) {
continue;
}
console.log(i);
}
// 0, 1, 3, 4Вложенные циклы
for (let i = 1; i <= 3; i++) {
for (let j = 1; j <= 3; j++) {
console.log(i + " × " + j + " = " + (i * j));
}
}break с меткой
outer: for (let i = 0; i < 3; i++) {
for (let j = 0; j < 3; j++) {
if (i === 1 && j === 1) {
break outer; // выход из обоих циклов
}
console.log(i, j);
}
}Сравнение циклов
| Цикл | Когда использовать |
|---|---|
for | Известное количество итераций |
while | Неизвестное количество, есть условие |
do...while | Минимум одно выполнение |
for...of | Перебор значений массива |
for...in | Перебор ключей объекта |
Практика
Задание 1: Сумма чисел
Задача: Вычисли сумму чисел от 1 до 10.
Запустите код для проверки
Loading...
Ваш вывод:
Ожидаемый результат:
55
Задание 2: Перебор массива
Задача: Выведи все элементы массива.
Запустите код для проверки
Loading...
Ваш вывод:
Ожидаемый результат:
красный зелёный синий
Задание 3: Поиск элемента
Задача: Найди индекс числа 7 в массиве и выйди из цикла.
Запустите код для проверки
Loading...
Ваш вывод:
Ожидаемый результат:
2
Задание 4: Фильтрация
Задача: Выведи только чётные числа от 1 до 10.
Запустите код для проверки
Loading...
Ваш вывод:
Ожидаемый результат:
2 4 6 8 10
Проверь себя
- Чем
forотличается отwhile? - Когда использовать
for...ofvsfor...in? - Что делает
break? - Что делает
continue?