Введение

Проходя вводный курс по Javascript и изучая все различные методы массивов. Я не совсем понимал реальную мощь метода сокращения, и только вернувшись к нему во второй раз, я теперь понимаю, насколько действительно полезен этот метод. Я надеюсь, что эта статья прояснит для некоторых, как работает этот метод и когда его использовать.

Метод

Array.prototype.reduce(callbackFunction)
Array.prototype.reduce(callbackFunction, InitialValue)

Что именно делает этот метод?

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

Параметры функции обратного вызова

callbackFunction(аккумулятор, текущеезначение, текущийиндекс, массив){}

аккумулятор

Накопленный результат предыдущей итерации или начальное значение, если оно указано.

текущее значение

Значение текущего обрабатываемого элемента массива.

текущийиндекс

Индекс текущего элемента, начиная с 0, если указано начальное значение, в противном случае — с 1.

множество

Массив, для которого выполняется метод уменьшения().

Начальное значение

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

Варианты использования

Наиболее распространенный пример использования метода уменьшения — это сумма массива.

const ages = [23, 15, 45, 13, 66, 54, 38];
let sumOfAges = ages.reduce(function(sumOfAges, currentAge){
    sumOfAges = sumOfAges   currentAge;
    return sumOfAges;
}); // 254

Хотя да, это именно то, для чего метод сокращения хорош, но он может сделать гораздо больше.

Получение максимального возраста группы

const ages = [23, 15, 45, 13, 66, 54, 38];
let oldestPerson = ages.reduce(function(maxAge, currentAge){
    if(currentAge>maxAge){
        maxAge = currentAge;
    }
    return maxAge;
}); // 66

Здесь мы используем метод уменьшения, чтобы сохранить самый высокий возраст, который мы встречаем в массиве, и возвращаем это значение после итерации по всему массиву.

Удаление дубликатов в массиве

const store = ['apple', 'pear', 'apple', 'orange', 'apple', 'pear'];
let itemCatalogue = store.reduce(function(uniqueStoreItems, currentItem){
    if(!uniqueStoreItems.includes(currentItem)){
        uniqueStoreItems.push(currentItem);
    }
    return uniqueStoreItems;
}, []); // ['apple', 'pear', 'orange']

Важно отметить, что в качестве начального значения в методе сокращения мы предоставляем пустой массив []. Это означает, что аккумулятор теперь представляет собой массив, и наша функция обратного вызова передает только те элементы, которых еще нет в этом массиве. В результате мы удалили дубликаты.

Получение количества элементов в массиве

const store = ['apple', 'pear', 'apple', 'orange', 'apple', 'pear'];
let itemCount = store.reduce(function(count, currentItem){
    count[currentItem] = (count[currentItem] || 0)   1;
    return count;
}, {}); // { apple: 3, pear: 2, orange: 1 }

Важно отметить, что начальное значение представляет собой пустой объект. Просматривая товары в магазине, мы заполняем их счетчиком.

Заключение

Прежде всего, если вы дочитали до этого момента, спасибо за прочтение! Моей главной целью при написании этой статьи было закрепить мое понимание метода сокращения, и я надеюсь, что, возможно, вы тоже узнали здесь что-то новое! Метод сокращения имеет множество действительно интересных приложений и очень удобен в использовании. Есть ли у вас какие-нибудь другие варианты использования или забавные трюки с этим методом? Мне бы хотелось знать!