Циклы в JavaScript

Циклы в JavaScript

Циклы в JavaScript Тематические порталы Портал Программистов • Портал JavaScript

Циклы в JavaScript

Введение

Циклы в JavaScript - это мощный механизм для выполнения повторяющихся операций, позволяющий эффективно обрабатывать коллекции данных и выполнять итеративные задачи.

Основные типы циклов

Цикл for

// Классический цикл
for (let i = 0; i < 5; i++) {
    console.log(i);
}

// Перебор элементов массива
let fruits = ['яблоко', 'банан', 'апельсин'];
for (let i = 0; i < fruits.length; i++) {
    console.log(fruits[i]);
}

Цикл for...of

// Перебор элементов массива
for (let fruit of fruits) {
    console.log(fruit);
}

// Работа со строками
let message = 'Hello';
for (let char of message) {
    console.log(char);
}

Цикл for...in

// Перебор свойств объекта
let person = {
    name: 'Иван',
    age: 30,
    city: 'Москва'
};

for (let key in person) {
    console.log(`${key}: ${person[key]}`);
}

Продвинутые циклы

Цикл while

let count = 0;
while (count < 5) {
    console.log(count);
    count++;
}

// Цикл do...while
let x = 0;
do {
    console.log(x);
    x++;
} while (x < 5);

Функциональные методы перебора

forEach

fruits.forEach((fruit, index) => {
    console.log(`${index}: ${fruit}`);
});

map

let numbers = [1, 2, 3, 4, 5];
let squared = numbers.map(num => num ** 2);
console.log(squared); // [1, 4, 9, 16, 25]

filter

let evenNumbers = numbers.filter(num => num % 2 === 0);
console.log(evenNumbers); // [2, 4]

Управление циклами

Операторы break и continue

// Прерывание цикла
for (let i = 0; i < 10; i++) {
    if (i === 5) {
        break; // Выход из цикла
    }
    console.log(i);
}

// Пропуск итерации
for (let i = 0; i < 5; i++) {
    if (i === 2) {
        continue; // Пропуск текущей итерации
    }
    console.log(i);
}

Вложенные циклы

// Перебор матрицы
let matrix = [
    [1, 2, 3],
    [4, 5, 6],
    [7, 8, 9]
];

for (let row of matrix) {
    for (let cell of row) {
        console.log(cell);
    }
}

Асинхронные циклы

// Использование Promise.all для параллельных операций
async function processArray(array) {
    const promises = array.map(async (item) => {
        // Асинхронная операция
        return await someAsyncOperation(item);
    });
    return Promise.all(promises);
}

Практические советы

• Выбирайте цикл, наиболее подходящий для конкретной задачи
• Будьте осторожны с бесконечными циклами
• Используйте функциональные методы для более читаемого кода
• Помните о производительности при работе с большими коллекциями

Заключение

Циклы в JavaScript предоставляют множество способов для эффективной итерации и обработки данных, от простых классических подходов до продвинутых функциональных методов.