Метод сокращения в JavaScript — один из краеугольных камней функционального программирования.

Это был один из тех рабочих дней, когда ко мне подошел коллега и спросил: «Почему ты так закодировал?» Я уже был немного расстроен, потому что он молча поправил и перекоммитил мой последний коммит в git в последний день.

В любом случае, наденьте улыбку и вперед — подумал я про себя. "Что ты имеешь в виду?" Я спросил его, и он познакомил меня с Array.prototype.reduce(), и хотя я все еще был расстроен его поведением в последний день, я был очень доволен тем, что он объяснил и показал мне замечательную функцию для использования с массивами в JavaScript.

Я хочу сделать то же самое с тобой, но не беря на себя твое последнее обязательство и молча исправляю его для тебя. Давайте просто начнем с определения.

Определение

Array.prototype.reduce()используется для перебора массива и сокращения его до одного элемента, точно так же, как базовое алгоритмическое сложение заданных значений в сумму.

array.reduce((accumulator, currentValue, currentIndex, array) =>
                                        accumulator + currentValue);

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

Пример

Представьте, что вы возвращаетесь с фермы или из приключения со своим персонажем в своей любимой ролевой игре. Теперь вы вернулись в город и хотите продать только что награбленные предметы оптом; вы собрали 3 одинаковых эпических предмета и хотите продать их все сразу. Например, это элемент:

(Надеюсь, вы узнали этот предмет из известной игры) В любом случае, теперь у вас есть три одинаковых предмета в вашем инвентаре, и вы хотите продать их все сразу (не нажимая на каждый по отдельности).

Array.reduce() поможет вам собрать всю сумму всех трех. Каждая стоит 2 золотых, 15 серебряных и 32 медных.

Этот пример дает вам необходимые строки для накопления общей цены продажи. Array.reduce() нужны две входные переменные для лямбда-выражения. Таким образом, он перебирает массив и накапливает каждые две пары значений. Представьте себе это так:

Наличие начального значения по умолчанию

Вы также можете добавить начальное значение по умолчанию в качестве второго аргумента. Например, у вас есть любимый торговец, такой как кузнец из Dark Souls, который всегда рад вас видеть и платит одно золото (или 1000 душ) за каждую совершенную вами сделку. Изучите следующий список, чтобы найти дополнительную 1 золотую монету.

Начни со спины!

Если вы хотите выполнить итерацию от конца к началу (назад), вы можете использовать reduceRight(). Здесь это не имело бы особого смысла. Поэтому я сохраняю пример в этом месте.

Старомодный способ

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

Выводы

  • Используйте Array.Prototype.Reduce() для функционального кода и придерживайтесь принципа неизменности
  • Используйте Array.Prototype.Reduce(), чтобы получить накопленное значение из массива
  • Вы можете установить начальное значение по умолчанию для процесса накопления
  • Используйте Array.prototype.reduceRight(), чтобы начать процесс накопления сзади вперед.

использованная литература

MDN WebDocs Reduce-Function: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce

Читать дальше