Метод Reduce

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

Метод reduce() позволяет вам «свернуть» массив к одному значению, выполняя предоставленную функцию для каждого элемента массива. Это единственное значение может быть числом, строкой, объектом или даже другим массивом.

Вот синтаксис метода reduce:

array.reduce(function(accumulator, currentValue, currentIndex, array) {
    // возвращаем обновленное значение аккумулятора
}, initialValue);

Ключевые компоненты:

accumulator: Накапливает возвращаемые значения функции обратного вызова (представьте это как промежуточный итог)

currentValue: Текущий обрабатываемый элемент в массиве

currentIndex: (необязательно) Индекс текущего элемента

array: (необязательно) Массив, для которого был вызван метод reduce()

initialValue: (необязательно) Значение, используемое в качестве первого аргумента при первом вызове функции обратного вызова

Например — сумма чисел:

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((acc, curr) => acc + curr, 0);
console.log(sum); // 15

Как это работает пошагово:

const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((acc, curr) => {
    console.log(`Accumulator: ${acc}, Current Value: ${curr}`);
    return acc + curr;
}, 0);

// Вывод:
// Accumulator: 0, Current Value: 1
// Accumulator: 1, Current Value: 2
// Accumulator: 3, Current Value: 3
// Accumulator: 6, Current Value: 4
// Итоговый результат: 10

Задание

Легко

Создайте функцию с именем calculateGroceryTotal, которая принимает массив объектов, представляющих продукты.

Каждый объект имеет два свойства:

name: строка (название товара)
price: число (цена товара)

Функция должна:

Рассчитать общую стоимость всех товаров
Применить скидку: - Если общая сумма превышает 100, применить скидку 10%
Если общая сумма больше 50, но меньше или равна 100, применить скидку 5%
Для сумм 50 и менее скидка не применяется.

Вернуть объект, содержащий:

originalTotal: сумма до скидки
discount: сумма экономии
finalTotal: итоговая сумма после скидки

Шпаргалка

Метод reduce() сворачивает массив к одному значению, выполняя функцию для каждого элемента:

array.reduce(function(accumulator, currentValue, currentIndex, array) {
    // возвращаем обновленное значение аккумулятора
}, initialValue);

Ключевые компоненты:

accumulator: Накапливает возвращаемые значения функции обратного вызова (промежуточный итог)
currentValue: Текущий обрабатываемый элемент
currentIndex: (необязательно) Индекс текущего элемента
array: (необязательно) Массив, для которого был вызван метод reduce()
initialValue: (необязательно) Начальное значение аккумулятора

Пример — сумма чисел:

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((acc, curr) => acc + curr, 0);
console.log(sum); // 15

Пошаговое выполнение:

const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((acc, curr) => {
    console.log(`Accumulator: ${acc}, Current Value: ${curr}`);
    return acc + curr;
}, 0);

// Вывод:
// Accumulator: 0, Current Value: 1
// Accumulator: 1, Current Value: 2
// Accumulator: 3, Current Value: 3
// Accumulator: 6, Current Value: 4
// Итоговый результат: 10

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

function calculateGroceryTotal(items) {
    // Напишите код здесь
    


    return {
        originalTotal: Math.round(originalTotal * 100) / 100,  // Округлить до 2 знаков после запятой
        discount: Math.round(discount * 100) / 100,
        finalTotal: Math.round(finalTotal * 100) / 100
    };
}