使用reduce函数返回一个数组

Question

为什么当我想在reduce 函数中使用push 函数返回一个新数组时出现错误。 但是，当我在 reduce 函数中使用 concat 方法时，它返回一个没有问题的新数组。

我要做的就是将数组传递给reduce 函数并返回相同的数组。

var store = [0,1,2,3,4];

var stored = store.reduce(function(pV,cV,cI){
  console.log("pv: ", pV);
  return pV.push(cV);
},[]);

这将返回一个错误。 但是当我使用 concat 时：

var store = [0,1,2,3,4];

var stored = store.reduce(function(pV,cV,cI){
  console.log("pv: ", pV);
  return pV.concat(cV);
},[]);

它返回相同的数组。

任何想法为什么？

Answer 1

push返回数组的新长度。

您需要的是最初提供的数组。

所以更改代码如下。

var store = [0, 1, 2, 3, 4];

var stored = store.reduce(function(pV, cV, cI){
  console.log("pv: ", pV);
  pV.push(cV);
  return pV; // *********  Important ******
}, []);

concat返回组合提供的数组元素和连接元素的新数组。 所以它有效。

Answer 2

只是为了完整性，对于下一个遇到这个问题的人，您所做的通常是通过map实现的，如文档中所述

map 为数组中的每个元素依次调用一次提供的回调函数，并根据结果构造一个新数组

对比一下reduce的描述：

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

（强调我的）所以你看，虽然你可以操纵reduce来返回一个新的数组，但它的一般用法是将一个数组减少到一个单一的值。

所以对于你的代码，这将是：

var store = [0,1,2,3,4];

var stored = store.map(function(pV){
  console.log("pv: ", pV);
  return pV;
});

比尝试在reduce函数中使用push或concat重建新数组要简单得多。

Answer 3

我知道这是相同的答案，但我只想表明使用reduce () ，语法也可以使用 ES6 简化为一行代码：

 var store = [0,1,2,3,4]; var stored = store.reduce((pV,cV) => [...pV, cV], []); console.log(stored);

Answer 4

Array.prototype.push方法返回数组的新长度。

Array.prototype.concat方法将新元素插入数组并返回数组，以便进一步处理。 这就是你需要用 reduce 做的事情：在下一次迭代中传递修改过的数组。

Answer 5

你总是可以使用解构：

 var store = [0,1,2,3,4]; var stored = store.reduce(function(pV,cV,cI){ console.log("pv: ", pV); return [...pV, cV]; },[]); console.log(stored);

Answer 6

如果您需要为迭代的每个项目返回一个包含多个项目的数组，reduce 会很有用；

var inputs = media.reduce((passedArray, video) => { passedArray.push("-i"); passedArray.push(video.filepath); return passedArray; }, []);

这里它被用来为 ffmpeg 构建输入数组；

[{ name: "bob", filepath: "1.mp4" }, { name: "sue", filepath: "3.mp4" }]

=> ["-i", "1.mp4", "-i", "2.mp4]