使用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]