Główna różnica między mapą a redukcją

Użyłem obu metod, ale jestem dość zdezorientowany, jeśli chodzi o użycie obu metod.

Czy jest coś, co mapmoże, ale reducenie może, i odwrotnie?

Uwaga: Wiem, jak używać obu metod, które kwestionuję, aby określić główną różnicę między tymi metodami i kiedy musimy ich użyć.

Źródło

Obie mapi reducemają jako dane wejściowe tablicę i funkcję, którą zdefiniujesz. Są w pewnym sensie komplementarne: mapnie mogą zwrócić pojedynczego elementu dla tablicy wielu elementów, a reducezawsze zwracają akumulator, który ostatecznie zmieniłeś.

map

Używając mapiteracji elementów, dla każdego elementu zwracasz żądany element.

Na przykład, jeśli masz tablicę liczb i chcesz uzyskać ich kwadraty, możesz to zrobić:

// 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

Używając tablicy jako danych wejściowych, możesz uzyskać pojedynczy element (powiedzmy obiekt, liczbę lub inną tablicę) na podstawie funkcji wywołania zwrotnego (pierwszy argument), która pobiera parametry accumulatori 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

Którą wybrać, jeśli możesz zrobić to samo z obydwoma? Spróbuj sobie wyobrazić, jak wygląda kod. W podanym przykładzie możesz obliczyć tablicę squares, jak wspomniałeś, używając 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)

Patrząc na to, oczywiście druga implementacja wygląda lepiej i jest krótsza. Zwykle wybierasz czystsze rozwiązanie, którym w tym przypadku jest map. Oczywiście możesz to zrobić reduce, ale w skrócie zastanów się, który byłby krótszy i ostatecznie byłby lepszy.

Generalnie „mapowanie” oznacza przekształcanie serii danych wejściowych w serie danych wyjściowych o równej długości, natomiast „zmniejszanie” oznacza przekształcanie serii danych wejściowych w mniejszą liczbę wyników.

To, co ludzie rozumieją przez „zmniejszanie mapy”, jest zwykle rozumiane jako „przekształcanie, prawdopodobnie równoległe, łączenie szeregowe”.

Kiedy „mapujesz”, piszesz funkcję, która przekształca się xz f(x)w nową wartośćx1 . Kiedy „redukujesz”, piszesz funkcję, g(y)która pobiera tablicę yi emituje tablicę y1. Pracują na różnych typach danych i dają różne wyniki.

Myślę, że to zdjęcie odpowie ci na temat różnicy między tymi HOC

Plik map()Zwraca się nową tablicę funkcji przez przepuszczanie przez każdy element tablicy wejściowego.

Różni się to od reduce()tego, że przyjmuje tablicę i funkcję w ten sam sposób, ale funkcja przyjmuje2 dane wejściowe - akumulator i wartość bieżącą.

Więc reduce()może być użyty tak map(), jakbyś zawsze .concatna akumulatorze następował wynik funkcji. Jednak jest częściej używany do zmniejszania wymiarów tablicy, więc albo branie jednowymiarowej i zwracanie pojedynczej wartości, albo spłaszczanie dwuwymiarowej tablicy itp.

Przyjrzyjmy się tym dwóm jeden po drugim.

Mapa

Map pobiera wywołanie zwrotne i uruchamia je na każdym elemencie tablicy, ale to, co czyni go unikalnym, to generuje nową tablicę na podstawie istniejącej tablicy .

var arr = [1, 2, 3];

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

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

Zmniejszyć

Metoda Reduce obiektu tablicy służy do zredukowania tablicy do jednej wartości .

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

Aby zrozumieć różnicę między mapowaniem, filtrowaniem i redukowaniem, pamiętaj o tym:

1. Wszystkie trzy metody są stosowane na tablicy, więc za każdym razem, gdy chcesz wykonać jakąkolwiek operację na tablicy, będziesz używać tych metod.
2. Wszystkie trzy stosują podejścia funkcjonalne i dlatego oryginalna tablica pozostaje taka sama . Oryginalna tablica nie zmienia się, zamiast tego zwracana jest nowa tablica / wartość.
3. Map zwraca nową tablicę z równym nie. elementów w oryginalnej tablicy. Dlatego jeśli oryginalna tablica ma 5 elementów, zwrócona tablica również będzie miała 5 elementów. Ta metoda jest używana, gdy chcemy dokonać jakiejś zmiany w każdym pojedynczym elemencie tablicy. Możesz pamiętać, że każdy element tablicy ann jest mapowany na jakąś nową wartość w tablicy wyjściowej, stąd nazwa map Na przykład,

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 zwraca nową tablicę z równą / mniejszą liczbą elementów niż oryginalna tablica. Zwraca te elementy w tablicy, które spełniły jakiś warunek. Ta metoda jest używana, gdy chcemy zastosować filtr do oryginalnej tablicy, a zatem nazwa filter. Np.

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

5. Reducezwraca pojedynczą wartość, w przeciwieństwie do mapy / filtra. Dlatego za każdym razem, gdy chcemy wykonać operację na wszystkich elementach tablicy, ale chcemy uzyskać jedno wyjście zawierające wszystkie elementy, używamy reduce. Możesz pamiętać, że wyjście tablicy jest zredukowane do jednej wartości, stąd nazwa reduce. Np.

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