Метод сокращения в 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