Javascript传播语法在对象中合并,但在数组中追加

时间:2018-09-01 20:25:11

标签: javascript reactjs redux functional-programming

我的情况很奇怪。我有2个对象:state.result是对象数组,而data.catalogs是类似于state.result的对象数组。

我想创建一个纯函数以返回两个合并的副本(在redux reducer中)。如果我运行:

 {
    ...state,
    result: {...state.result, ...data.catalogs}
  }

所有内容都是hunkey dorey,state.result中的4项与data.catalogs中的1项合并了,给我留下了4项的返回值。问题是我想要一个项目数组,这使我和具有包含项目的4个属性的对象。

如果我跑步:

  {
    ...state,
    result: [...state.result, ...data.catalogs]
  }

它给了我想要的项目数组,但是没有合并它们,而是附加了它们,所以我得到了5个项目的数组(state.result和data.catalogs中该项目的副本)。

为什么会发生这种情况,以及如何合并数组中的项目?

2 个答案:

答案 0 :(得分:1)

    {
    ...state,
    result: {...state.result, ...data.catalogs}
  }

如何使用它,然后使用Object.values(results)从中获取您想要的值,也可以.map()使用它。

我希望能有所帮助。

答案 1 :(得分:1)

您将不得不单独处理数组合并

const x = [{id: 1}, {id: 2, name: 'two'}, {}];
const y = [{name: 'one'}, {}, {id: 3, name: 'three'}];

const z = x.map((e, index) => Object.assign({}, {...e, ...y[index]}));

// z = [{id: 1, name: 'one'}, {id: 2, name: 'two'}, {id: 3, name: 'three'}]