如何合并 2 个不同的对象数组并返回匹配项和不匹配项？答案

【问题标题】：How to merge 2 different arrays of objects and return both matching and non matching items?如何合并 2 个不同的对象数组并返回匹配项和不匹配项？
【发布时间】：2020-01-02 08:38:38
【问题描述】：

我想要合并 2 个不同的数组。

var arr1 = [ { cardId: 1001, knowCnt: 0, dknowCnt: 1 }, { cardId: 1002, knowCnt: 0, dknowCnt: 2 }, { cardId: 1003, knowCnt: 1, dknowCnt: 3 } ];

var arr2= [
  {
    cardId: 1001,
    videoId: "l4LjOvERDoM",
    startSeconds: 5,
    endSeconds: 10,
  },

  {
    cardId: 1002,
    videoId: "jsFVnf3iF3w",
    startSeconds: 5,
    endSeconds: 10,
  },

  {
    cardId: 1003,
    videoId: "dc0q0H9CO9k",
    startSeconds: 5,
    endSeconds: 10,
  },

  {
    cardId: 1004,
    videoId: "kdZe5ZjfNX4",
    startSeconds: 5,
    endSeconds: 10,
  }
];

这两个数组有一个匹配的cardId，我希望将arr1 中的knowCnt 和dknowCnt 添加到arr2 中它们各自的cardId 属性中。 here 的一个潜在解决方案是：

    var mergeArrays = function() {
             var merged = [];

             const mergeById = (a1, a2) =>
                a1.map(itm => ({
                    ...a2.find((item) => (item.id === itm.id) && item), 
                    ...itm
                }));
            console.log(mergeById(arr1, arr2));
             }
      mergeArrays()

这很好用，但只返回匹配的项目。如何返回一个包含匹配项（如上更新）但还包括来自 arr2 的剩余项的单个数组。换句话说，结果数组看起来像 arr2，但从 arr1 更新了 3 个项目？注意：数组的顺序可能不匹配。

谢谢

【问题讨论】：

olease 添加结果。匹配对象会发生什么？

标签： javascript

【解决方案1】：

您可以获取Map 并通过更新知道cardId 过滤array2。

var array1 = [{ cardId: 1001, knowCnt: 0, dknowCnt: 1 }, { cardId: 1002, knowCnt: 0, dknowCnt: 2 }, { cardId: 1003, knowCnt: 1, dknowCnt: 3 }],
    array2 = [{ cardId: 1001, videoId: "l4LjOvERDoM", startSeconds: 5, endSeconds: 10 }, { cardId: 1002, videoId: "jsFVnf3iF3w", startSeconds: 5, endSeconds: 10 }, { cardId: 1003, videoId: "dc0q0H9CO9k", startSeconds: 5, endSeconds: 10 }, { cardId: 1004, videoId: "kdZe5ZjfNX4", startSeconds: 5, endSeconds: 10 }],
    references = array1.reduce((m, o) => m.set(o.cardId, o), new Map),
    filtered2 = array2.filter(o => {
        if (!references.has(o.cardId)) return true;
        Object.assign(references.get(o.cardId), o);
    });

console.log(array1);
console.log(filtered2);

.as-console-wrapper { max-height: 100% !important; top: 0; }

【讨论】：

【解决方案2】：

这里没有什么复杂的，只是连接数组并通过想要的键生成一个对象......非常简单的代码

const res = [...arr1, ...arr2].reduce((agg, v) => {
   agg[v.cardId] = Object.assign(agg[v.cardId] || {}, v)   
   return agg
}, {})

console.log(res)

【讨论】：