在 Array.reduce 中使用扩展符号

Question

我正在尝试让 es6 语法适用于此代码片段。

let checkList = [1, 2].map(i => "Check " + i)

let checks = checkList
  // .reduce((acc, check) => Object.assign(acc, {[check]: {valid: false}}), {})
  .reduce((acc, check) => {...acc, {[check]: {valid: false}}}, {})
console.log(checks)

如果我使用 https://babeljs.io 中的注释行，输出如下，这就是我想使用新语法获得的结果。

Object {
  "Check 1": Object {
    "valid": false
  },
  "Check 2": Object {
    "valid": false
  }
}

我不确定这段代码是否有语法错误。我尝试在 babeljs 中选择所有预设，但它无法正确编译。

Answer 1

应在 Babel 中启用对象传播 stage 4 proposal and isn't part of existing specifications. Stage 3 preset，即 transform-object-rest-spread。

上面的代码中存在语法错误，即使使用所需的预设也无法正确编译。

它should be

let checks = checkList
  .reduce((acc, check) => ({...acc, [check]: {valid: false}}), {});

Answer 2

首先，您没有将属性包装在一个额外的对象中（除非您还想对其使用扩展运算符）。

所以{...acc, {[check]: {valid: false}}}可以变成{...acc, [check]: {valid: false}}

这意味着您要向累加器添加一个对象。该对象的键是您分配给它的名称 (Check[n])，值是您设置的名称 ({valid...})。

其次，据我所知，如果没有明确的新值，您不能使用扩展运算符。所以你应该把你的状态写在一个新行上，比如：

let checks = checkList.reduce((acc, check) => {
  return {...acc, [check]: {valid: false}}
}, {})

或用额外的括号括起来：

let checks = checkList.reduce((acc, check) => ({...acc, [check]: {valid: false}}) , {})

在 Array.reduce 中使用扩展符号

Using spread notation in Array.reduce

javascript

ecmascript-6

ecmascript-next