Методы массивов в JavaScript: forEach, map, filter, reduce

Разбираем популярные методы массивов JavaScript — forEach, map, filter и reduce. Простые примеры, объяснения и практика.

Что такое методы массивов

Методы массивов — это встроенные функции, которые упрощают работу со списками данных. Они позволяют перебирать, изменять, фильтровать и агрегировать массивы.

Мы рассмотрим 4 популярных метода: forEach, map, filter, reduce.

forEach

Метод forEach просто перебирает элементы массива и выполняет действие для каждого:

Скопировать
let users = ["Анна", "Иван", "Сергей"];

users.forEach(function(name) {
  console.log("Привет, " + name + "!");
});

Важно: forEach ничего не возвращает — он просто делает что-то для каждого элемента.

map

Метод map создаёт новый массив, применяя функцию ко всем элементам исходного массива.

Скопировать
let numbers = [1, 2, 3];

let squares = numbers.map(function(n) {
  return n * n;
});

console.log(squares); // [1, 4, 9]

Запомни: map не меняет оригинальный массив, а возвращает новый.

filter

filter возвращает новый массив, включающий только те элементы, для которых функция вернёт true.

Скопировать
let ages = [12, 17, 20, 30];

let adults = ages.filter(function(age) {
  return age >= 18;
});

console.log(adults); // [20, 30]

reduce

Метод reduce «сворачивает» массив в одно значение. Это может быть сумма, строка, объект — что угодно.

Скопировать
let numbers = [1, 2, 3, 4];

let total = numbers.reduce(function(sum, current) {
  return sum + current;
}, 0);

console.log(total); // 10

Когда использовать какой метод

  • forEach — когда просто нужно пройтись по элементам (например, вывести на экран).
  • map — когда нужно получить новый массив, изменив элементы.
  • filter — когда нужно отобрать часть элементов.
  • reduce — когда нужно объединить элементы в одно значение.

Совет: Прежде чем применять метод, подумай — какой результат тебе нужен: список, отфильтрованные значения или одно итоговое число?

Что дальше

В следующем уроке мы изучим работу с DOM — как находить элементы на странице и менять их содержимое с помощью JavaScript.