时间戳

首页 > 解决方案 > 合并两个数组，在 redux 中使用不可变模式避免重复

javascript - 合并两个数组，在 redux 中使用不可变模式避免重复

问题描述

假设我有两个数组：

let A = [a,b,c,d]
let B = [c,d,e]

其中每个字母都是一个具有多个属性的对象，其中一个id是在我的域中是唯一的。合并的结果将是

[a,b,c,d,e]

[c,d]来自哪里B.

使用一种优雅的方法，我将如何合并这两个数组，以使其中的任何元素B都会覆盖其中的任何现有元素，A而所有其他元素都保持不变。所以这是一个B在发生冲突时元素优先的联合。

我有两个想法（使用 ES6 和 lodash）：

//remove same elements first, then join arrays
let ids = new Set(B.map(e => e.id));
let newState = _.reject(A, constraint => ids.has(constraint.id));
return newState.concat(B);

//convert both to hashmap, join, then take values
let B_map = _.keyBy(B, 'id');
let A_map = _.keyBy(A, 'id');
return {...A_map, ...B_map}.values();

是否有更短/更简洁/更易读的版本？也许一个没有外部依赖？我本质上是在寻找类似的东西

任何元素之间的相等性由id属性（或 v2 中的比较器函数）定义。

标签： javascriptecmascript-6reduxlodash

解决方案

如果没有外部依赖项，您可以使用filter从A没有 id 的元素B和concat带有id 的元素中提取元素B：

const A = [{id: 1, name: 'x'}, {id: 2, name: 'y'}, {id: 3, name: 'z'}];
const B = [{id: 2, name: 'hello'}];

let ids = new Set(B.map(e => e.id));
let newState = A.filter(a => !ids.has(a.id)).concat(B);

console.log(newState);

推荐阅读