Основна різниця між картою та зменшенням

Я використовував обидва методи, але я дуже розгублений щодо використання обох методів.

Чи є щось, що mapможе зробити, але reduceне може, і навпаки?

Примітка: Я знаю, як використовувати обидва методи, які я опитую, на предмет головної різниці між цими методами та часом, коли нам потрібно використовувати.

Джерело

Обидва mapі reduceмають як вхід масив і функцію, яку ви визначаєте. Вони певним чином доповнюють mapодин одного : не можуть повернути один елемент для масиву з декількох елементів, тоді як reduceзавжди повернуть накопичувач, який ви з часом змінили.

map

Використовуючи mapітерацію елементів, і для кожного елемента ви повертаєте потрібний елемент.

Наприклад, якщо у вас є масив чисел і ви хочете отримати їх квадрати, ви можете зробити це:

// A function which calculates the square
const square = x => x * x

// Use `map` to get the square of each number
console.log([1, 2, 3, 4, 5].map(square))

reduce

Використовуючи масив як вхідні дані, ви можете отримати один єдиний елемент (припустимо, об’єкт, або число, або інший масив) на основі функції зворотного виклику (перший аргумент), яка отримує параметри accumulatorта current_element:

const numbers = [1, 2, 3, 4, 5]

// Calculate the sum
console.log(numbers.reduce(function (acc, current) {
  return acc + current
}, 0)) // < Start with 0

// Calculate the product
console.log(numbers.reduce(function (acc, current) {
  return acc * current
}, 1)) // < Start with 1

Який із них вибрати, коли можна робити те саме з обома? Спробуйте уявити, як виглядає код. У наведеному прикладі ви можете обчислити масив квадратів, як ви вже згадали, використовуючи reduce:

// Using reduce
[1, 2, 3, 4, 5].reduce(function (acc, current) {
    acc.push(current*current);
    return acc;
 }, [])

 // Using map
 [1, 2, 3, 4, 5].map(x => x * x)

Тепер, дивлячись на них, очевидно, що друга реалізація виглядає краще і вона коротша. Зазвичай ви вибираєте чистіший розчин, який у цьому випадку є map. Звичайно, ви можете це зробити reduce, але, в двох словах, подумайте, що було б коротшим, і з часом це було б краще.

Як правило, "карта" означає перетворення ряду входів у серію виходів однакової довжини, тоді як "зменшити" означає перетворення серії входів у меншу кількість виходів.

Те, що люди мають на увазі під "зменшенням карти", зазвичай тлумачиться як "перетворювати, можливо паралельно, послідовно поєднувати".

Коли ви «карта», ви пишете функцію , яка перетворює xз f(x)в яке - то нове значення x1. Коли ви "зменшуєте", ви пишете якусь функцію, g(y)яка приймає масив yі випромінює масив y1. Вони працюють над різними типами даних і дають різні результати.

Думаю, ця картина дасть вам відповідь про різницю між тими HOC

map()Функція повертає новий масив через передаючи функцію над кожним елементом у вхідному масиві.

Це відрізняється від того, reduce()який приймає масив і функцію однаково, але функція бере 2вхідні дані - акумулятор і поточне значення.

Таким чином, це reduce()може бути використано, map()якби ви завжди .concatзнаходили на акумуляторі наступний вивід функції. Однак він частіше використовується для зменшення розмірів масиву, тож приймаючи одновимірне і повертаючи одне значення, або вирівнюючи двовимірний масив тощо.

Давайте розглянемо цих двох по одному.

Карта

Map бере зворотний виклик і запускає його проти кожного елемента масиву, але що робить його унікальним, це те, що він створює новий масив на основі вашого існуючого масиву .

var arr = [1, 2, 3];

var mapped = arr.map(function(elem) {
    return elem * 10;
})

console.log(mapped); // it genrate new array

Зменшити

Метод Reduce об'єкта масиву використовується для зменшення масиву до одного значення .

var arr = [1, 2, 3];

var sum = arr.reduce(function(sum, elem){
    return sum + elem;
})

console.log(sum) // reduce the array to one single value

Щоб зрозуміти різницю між картою, фільтруванням та зменшенням, пам’ятайте про це:

1. Всі три методи застосовуються до масиву, тому будь-коли, коли ви хочете зробити будь-яку операцію над масивом, ви будете використовувати ці методи.
2. Всі три дотримуються функціональних підходів, і тому вихідний масив залишається незмінним . Оригінальний масив не змінюється, натомість повертається новий масив / значення.
3. Map повертає новий масив з рівним ні. елементів , які є в оригінальному масиві. Отже, якщо вихідний масив має 5 елементів, повернутий масив також матиме 5 елементів. Цей метод використовується, коли ми хочемо внести певні зміни в кожен окремий елемент масиву. Ви можете пам’ятати, що кожен елемент масиву ann зіставляється з якимсь новим значенням у вихідному масиві, тому ім’я map For, наприклад,

var originalArr = [1,2,3,4]
//[1,2,3,4]
var squaredArr = originalArr.map(function(elem){
  return Math.pow(elem,2);
});
//[1,4,9,16]

4. Filter повертає новий масив з рівною / меншою кількістю елементів, ніж вихідний масив. Він повертає ті елементи масиву, які пройшли якусь умову. Цей метод використовується, коли ми хочемо застосувати фільтр до вихідного масиву, тому ім'я filter. Наприклад,

var originalArr = [1,2,3,4]
//[1,2,3,4]
var evenArr = originalArr.filter(function(elem){
  return elem%2==0;
})
//[2,4]

5. Reduceповертає одне значення, на відміну від карти / фільтра. Тому, коли ми хочемо запустити операцію з усіма елементами масиву, але хочемо один вихід із використанням усіх елементів, ми використовуємо reduce. Ви можете пам’ятати, що вихід масиву зведений до одного значення, тому ім’я reduce. Наприклад,

var originalArr = [1,2,3,4]
//[1,2,3,4]
var sum = originalArr.reduce(function(total,elem){
  return total+elem;
},0)
//10