在 JavaScript 中使用 Reduce 方法和传播运算符改变对象数组

Mutate an Array of Objects Using the Reduce Method and Spread Operator in JavaScript

我目前正在学习 JavaScript 并试图测试 传播运算符 的局限性以及 reduce() 方法。

示例:

const numArray = [1, 6, 9, 4, 21, 8, 15];

const sumEvenOdd = numArray.reduce((acc, current) => 
   current % 2 === 0 
      ? {...acc,'even': acc.even + current} 
      : {...acc,'odd': acc.odd + current}, 
      {"even": 0, "odd": 0}
);

console.log(sumEvenOdd); //{ even: 18, odd: 46 }  

正如您从上面的代码中看到的,我能够改变 reduce() 方法的初始值,它是一个对象:{" even": 0, "odd": 0} 跟踪 numArray 的偶数和奇数之和,并使用 Spread Operator 填写其他剩余的 属性.

问题:
如果我有一个对象数组作为初始值,我可以做同样的事情吗?例如,[{"even": 0}, {"odd": 0}] 如果没有,我可以做些什么作为替代方案,以便我可以填写其他属性我没有提到例如对象是否还包含其他属性?例如,[{"even": 0, "color": ""...}, {"odd": 0, "color": ""...}]

是的,你可以用任何道具修改数组

你可以使用任何类型 reduce: objects, arrays, numbers, strings, boolean

几个不同类型的例子:

const concatNumbersAsString = [0,1,2].reduce((a,c) => a + c, '');

const flatNestedArrays = [[0],[1],[2]].reduce((a,c) => a.concat(c), [])

const checkBoolCondition = [0,1,2].reduce((a,c) => [1].includes(c), true)

const calculateSum = [0,1,2].reduce((a,c) => a + c, 0)

console.log('concatNumbersAsString', concatNumbersAsString)
console.log('flatNestedArrays', flatNestedArrays)
console.log('checkBoolCondition', checkBoolCondition)
console.log('calculateSum', calculateSum)

修改数组:

const numArray = [1, 6, 9, 4, 21, 8, 15];

const sumEvenOdd = numArray.reduce((acc, current) => 
   current % 2 === 0 
      ? acc.map(i => i.hasOwnProperty('even') ? {...i, even: i.even + current} : i)
      : acc.map(i => i.hasOwnProperty('odd') ? {...i, odd: i.odd + current} : i), 
      [{"even": 0, color: 'red'},{ "odd": 0, color: 'green'}]
);

console.log(sumEvenOdd)