reduce 方法

Version >= 5.1

reduce() 方法对累加器和数组的每个值(从左到右)应用函数以将其减少为单个值。

数组总和

此方法可用于将数组的所有值压缩为单个值:

[1, 2, 3, 4].reduce(function(a, b) {
  return a + b;
});
// → 10

可选的第二个参数可以传递给 reduce()。它的值将用作第一次调用回调的第一个参数(指定为 a)(指定为 function(a, b))。

[2].reduce(function(a, b) {
  console.log(a, b); // prints: 1 2
  return a + b;
}, 1);
// → 3

Version >= 5.1

展平对象数组

下面的示例显示了如何将对象数组展平为单个对象。

var array = [{
    key: 'one',
    value: 1
}, {
    key: 'two',
    value: 2
}, {
    key: 'three',
    value: 3
}];

Version <= 5.1

array.reduce(function(obj, current) {
  obj[current.key] = current.value;
  return obj;
}, {});

Version >= 6

array.reduce((obj, current) => Object.assign(obj, {
  [current.key]: current.value
}), {});

Version >= 7

array.reduce((obj, current) => ({...obj, [current.key]: current.value}), {});

请注意, Rest / Spread 属性不在 ES2016完成提案列表中。ES2016 不支持它。但我们可以使用 babel 插件 babel-plugin-transform-object-rest-spread来支持它。

Flatten Array 的所有上述示例都会导致:

{
  one: 1,
  two: 2,
  three: 3
}

Version >= 5.1

使用 Reduce 映射

作为使用初始值参数的另一个示例,请考虑在项数组上调用函数的任务,将结果返回到新数组中。由于数组是普通值,列表连接是普通函数,我们可以使用 reduce 来累积列表,如下例所示:

function map(list, fn) {
  return list.reduce(function(newList, item) {
    return newList.concat(fn(item));
  }, []);
}

// Usage:
map([1, 2, 3], function(n) { return n * n; });
// → [1, 4, 9]

请注意,这仅用于说明(初始值参数),使用本机 map 来处理列表转换(请参阅映射值以获取详细信息)。

Version >= 5.1

查找最小值或最大值

我们也可以使用累加器来跟踪数组元素。这是一个利用它来查找最小值的示例:

var arr = [4, 2, 1, -10, 9]

arr.reduce(function(a, b) {
  return a < b ? a : b
}, Infinity);
// → -10

Version >= 6

寻找独特的值

下面是一个使用 reduce 将唯一数字返回给数组的示例。空数组作为第二个参数传递,并由 prev 引用。

var arr = [1, 2, 1, 5, 9, 5];

arr.reduce((prev, number) => {
  if(prev.indexOf(number) === -1) {
    prev.push(number);
  }
  return prev;
}, []);
// → [1, 2, 5, 9]