`map`和`reduce`之间的主要区别

时间:2018-04-20 06:02:02

标签: javascript dictionary reduce

我使用了这两种方法,但我对这两种方法的使用感到很困惑。

map能做什么但reduce不能做,反之亦然?

注意:我知道如何使用这两种方法来质疑这些方法与我们需要使用的时间之间的主要区别。

7 个答案:

答案 0 :(得分:75)

  

enter image description here   

mapreduce都将数组和您定义的函数作为输入。它们在某种程度上是互补的: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和{的回调函数(第一个参数)获取一个单独的元素(假设一个Object,或一个数字或另一个数组) {1}}参数:

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来做,但简而言之,想一想哪个会更短,最终会更好。

答案 1 :(得分:11)

我认为这张图片将回答您有关这些HOC之间的区别 enter image description here

答案 2 :(得分:3)

通常“map”表示将一系列输入转换为等长系列输出,而“reduce”表示将一系列输入转换为较小数量的输出

“map-reduce”的含义通常被解释为“变换,可能并行,串行组合”。

当您“映射”时,您正在编写一个函数,将xf(x)转换为一些新值x1。当你“减少”时,你正在编写一些函数g(y),它接受​​数组y并发出数组y1。它们处理不同类型的数据并产生不同的结果。

答案 3 :(得分:3)

要了解map,filter和reduce的区别,请记住以下几点:

  1. 这三种方法都应用于数组,因此,只要您想对数组进行任何操作,都将使用这些方法。
  2. 这三个方法均遵循功能性方法,因此原始数组保持不变。原始数组不会更改,而是会返回新的数组/值。
  3. Map 返回编号等于的新数组。元素,与原始数组中的元素相同。因此,如果原始数组有5个元素,则返回的数组也将有5个元素。每当我们要对数组的每个元素进行一些更改时,都会使用此方法。您可以记住,ann数组的每个元素都被映射到输出数组中的某个新值,因此名称为map 例如,

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]

  1. Filter 返回一个与原始数组相等/更少元素的新数组。它返回数组中已通过某些条件的那些元素。当我们要在原始数组上应用过滤器时使用此方法,因此名称为filter。例如,

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

  1. 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

答案 4 :(得分:2)

让我们逐一看看其中的两个

<强>地图  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

答案 5 :(得分:1)

map()函数通过在输入数组中的每个元素上传递函数来返回一个新数组。

这与reduce()不同,它以相同的方式获取数组和函数,但该函数接受2输入 - 累加器和当前值。

如果你总是reduce()在函数的下一个输出上累加器,那么map()可以像.concat一样使用。然而,它更常用于减少数组的尺寸,以便采用一维并返回单个值或展平二维数组等。

答案 6 :(得分:0)

map 函数在每个元素上执行一个给定的函数,但是 reduce 执行一个函数,将数组减少到单个值。我会举一个例子:

// map function
var arr = [1, 2, 3, 4];
var mappedArr = arr.map((element) => { // [10, 20, 30, 40]
return element * 10;

}) 
// reduce function
var arr2 = [1, 2, 3, 4]
var sumOfArr2 = arr2.reduce((total, element) => { // 10
return total + element; 

})