TGViewer
Frontend | Вопросы собесов Frontend | Вопросы собесов @easy_javascript_ru · 17.6K subscribers
Post #276 8.81K
Как работают map, reduce и filter ?
Спросят с вероятностью 7%

map, reduce и filter — это методы массивов, которые позволяют обрабатывать и трансформировать массивы функциональным способом.

Метод map

Создает новый массив, в котором каждый элемент является результатом вызова предоставленной функции на каждом элементе исходного массива.

Как он работает

✅Итерирует по каждому элементу массива.
✅Применяет к каждому элементу функцию.
✅Возвращает новый массив с результатами вызова функции для каждого элемента.
const numbers = [1, 2, 3, 4];
const doubled = numbers.map(num => num * 2);
console.log(doubled); // [2, 4, 6, 8]


В этом примере функция умножает каждый элемент массива numbers на 2, и результат сохраняется в новом массиве doubled.

Метод reduce

Применяется к массиву и сводит его к одному значению. Функция принимает аккумулятор и текущий элемент, производит операцию и возвращает новый аккумулятор.

Как он работает


✅Итерирует по каждому элементу массива.
✅Применяет к каждому элементу функцию, которая обновляет аккумулятор.
✅Возвращает единственное значение — аккумулятор.
const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((acc, num) => acc + num, 0);
console.log(sum); // 10


Здесь reduce суммирует все элементы массива, начиная с аккумулятора, равного 0.

Метод filter

Создает новый массив, содержащий все элементы исходного массива, для которых функция-условие возвращает true.

Как он работает

✅Итерирует по каждому элементу массива.
✅Применяет к каждому элементу функцию-условие.
✅Возвращает новый массив с элементами, прошедшими условие.
const numbers = [1, 2, 3, 4];
const even = numbers.filter(num => num % 2 === 0);
console.log(even); // [2, 4]


В этом примере filter создает новый массив, содержащий только четные числа из массива numbers.

✅map: создает новый массив, преобразуя каждый элемент по заданной функции.
✅reduce: сводит массив к одному значению, применяя функцию к каждому элементу.
✅filter: создает новый массив, содержащий только элементы, которые соответствуют условию.

Все три метода делают код более читаемым и декларативным, облегчая работу с массивами.

👉 Можно посмотреть Примеры как отвечают люди на этот вопрос, или перейти К списку 1429 вопроса на Frontend разработчика. Ставь 👍 если нравится контент

🔐 База собесов | 🔐 База тестовых
  • 👍 42
  • ❤ 5
  • 🔥 3
More from @easy_javascript_ru
  1. Oct 17, 2026🤔 Какие значения будут являться falsy значениями? В JavaScript значения, которые при прив…
  2. Oct 16, 2026🤔 Что такое meta теги? Meta-теги – это специальные HTML-теги, которые содержат метаинформ…
  3. Oct 15, 2026🤔 Какие преимущества у di? Dependency Injection (DI) – это паттерн проектирования, которы…
  4. Oct 14, 2026🤔 Зачем создавались библиотеки react и другие? Библиотеки, такие как React, создавались д…
  5. Oct 13, 2026🤔 Что такое репозиторий? Это хранилище кода, файлов и их истории изменений. Используется…
  6. Oct 13, 2026🤔 Как мы можем замерить скорость работы участка кода с date.Now? В JavaScript можно замер…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →