Цепочки методов массивов

Часть раздела Логика и поток путешествия по JavaScript на Coddy — урок 55 из 65.

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

Вот пример объединения методов массива в цепочку:

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

const result = numbers
  .filter(num => num % 2 === 0)
  .map(num => num * 2)
  .reduce((sum, num) => sum + num, 0);

console.log(result); // 60

В этом примере мы начинаем с массива чисел, отфильтровываем нечетные числа, удваиваем каждое оставшееся число и затем суммируем результаты.

Порядок цепочки вызовов имеет значение. Каждый метод в цепочке работает с результатом предыдущего метода.

Задание

Легко

Создайте функцию с названием processFruits, которая принимает массив объектов фруктов. Каждый объект фрукта имеет свойства name (строка) и quantity (число).

Функция должна использовать цепочку методов массива, чтобы:

Отфильтровать фрукты с количеством 0
Преобразовать название каждого фрукта в верхний регистр
Создать строку, в которой перечислены все фрукты с их количеством в формате "APPLE: 5, BANANA: 3"

Небольшое напоминание:

Вы можете использовать функцию .join(", ") для преобразования массива строк в одну единую строку.

Можно добавить в цепочку даже функцию .join():

arr.filter(...)
   .map(...)
   .join(...)

Шпаргалка

Цепочка методов массива позволяет выполнять несколько операций над массивом в одном выражении, делая код более лаконичным и читаемым.

Каждый метод в цепочке работает с результатом предыдущего метода:

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

const result = numbers
  .filter(num => num % 2 === 0)
  .map(num => num * 2)
  .reduce((sum, num) => sum + num, 0);

console.log(result); // 60

Вы также можете добавить в цепочку метод .join(), чтобы преобразовать массив в строку:

arr.filter(...)
   .map(...)
   .join(", ")

Попробуйте сами

function processFruits(fruits) {
  // Напишите ваш код здесь
}

Проверьте себя

В этом уроке есть небольшой тест. Начните урок, чтобы ответить на вопросы и сохранить прогресс.

Все уроки раздела Логика и поток

1Строки в деталях

Основы работы со строками Итерация по строкам Шаблонные литералы Методы строк Итоги — String Weaver

4JSON Часть 2

Итерация по JSON Вложенный JSON Опциональная цепочка JSON Поверхностное и глубокое копирование Повторение — Магазин велосипедов Повторение — Солнечная система

7Система управления библиотекой

Обзор проекта Добавление книг

Поиск по названию

Фильтрация по жанру

Отметить как прочитанное

10Управление системой фестиваля

Обзор проекта Добавление фильмов и площадок

2Многомерные массивы

Основы 2D массивов Доступ к элементам 2D массива Вложенные циклы и 2D массивы Повторение: 2D массивы Сложение и вычитание матриц Ступенчатые массивы 3D массивы и далее Распространенные паттерны 2D массивов Повторение: всё о массивах

5Множества. Часть 1

Что такое множество?Итерация по множествам Добавление элемента Удаление элемента Проверка наличия элемента Размер и проверка на пустоту Копирование и очистка Итоги — Основы множеств

8Интересные темы о массивах

Деструктуризация массивов Синтаксис Spread в массивах Разреженные массивы Итоги — Воркшоп по массивам

3JSON. Часть 1

Что такое JSON?Проверка наличия ключа Методы объектов Оператор spread. Часть 1 Оператор spread. Часть 2 Удаление ключей Повторение: манипуляции с ключами JSON

6Множества. Часть 2

Математика — Объединение множеств Математика — Пересечение множеств Математика — Разность множеств Математика — Симметрическая разность Подмножества и надмножества Повторение — Группировка друзей

9Продвинутые методы массивов

Методы Join и Split Метод Map Метод Filter Метод ReduceЦепочки методов массивовForEach и Map — это одно и то же?Метод Sort Методы Find и FindIndex Итоги — Мастер цепочек