时间戳

首页 > 解决方案 > Array.reduce 中对象解构的使用

javascript - Array.reduce 中对象解构的使用

问题描述

我试图解决另一个人关于 SO 使用Array.prototype.reduce和...object解构的问题。我不明白为什么它在我使用时按预期工作Object.assign，但在使用传播运算符时却没有。

const str = 'Jack:13,Phil:15,Lucy:12'

const arr = str.split(',')

let reducer = (acc, val) => {
  return { ...acc,
    ...{
      [val.split(':')[0]]: Number(val.split(':')[1])
    }
  }
}

let reducer2 = (acc, val) => {
  return Object.assign(acc, {
    [val.split(':')[0]]: Number(val.split(':')[1])
  })
}

let obj = {
  Jody: 29
}

let obj2 = {
  Julie: 28
}

arr.reduce(reducer, obj)
arr.reduce(reducer2, obj2)

console.log(obj)
/* output:
{
  "Jody": 29
}
*/
console.log(obj2)
/* output:
{
  "Julie": 28,
  "Jack": 13,
  "Phil": 15,
  "Lucy": 12
}
*/

标签： javascriptecmascript-6ecmascript-harmony

解决方案

数组reduce通常用于返回一个新值。即使它改变了一个累加器，也可以安全地假设它可以返回一个新值。

arr.reduce(reducer, obj)依赖那个obj是变异的。reducer2确实会改变原始对象，这就是它起作用的原因。但这与reducer保持累加器不可变的条件相矛盾。

它应该是：

obj = arr.reduce(reducer, obj);

推荐阅读