当一个包含更新的数据时，Javascript合并数组答案

【问题标题】：Javascript merge arrays when one contains updated data当一个包含更新的数据时，Javascript合并数组
【发布时间】：2016-07-13 22:44:42
【问题描述】：

我有两个这样的对象数组：

var myArray = [
  {pk: '1', person: 'person 1'}, 
  {pk: '2', person: 'someone'}, 
];

var updatedArray = [
  {pk: '2', person: 'another person'}
];

我希望以最有效的方式将两者合并。我的想法是将旧的 myArray 合并到新的 updatedArray 中，并忽略 myArray.pk == updatedArray.pk 的任何项目

我在尝试使用 jQuery 或下划线时遇到问题。我也一直在尝试以this one 为例。

有什么想法吗？

【问题讨论】：

Merging two collections using Underscore.JS的可能重复
预期结果是什么？

标签： javascript jquery underscore.js

【解决方案1】：

我认为循环更新并将其复制到当前值将是一个好方法。如果您只有一个属性要更改，则不需要Object.assign。您可以简单地将其替换为

myArray[idx].name = uv.name

var myArray = [
  {pk: '1', person: 'person 1'}, 
  {pk: '2', person: 'someone'}, 
];

var updatedArray = [
  {pk: '2', person: 'another person'}
];

updatedArray.forEach(uv => {
  var idx = myArray.findIndex(v => v.pk === uv.pk)
  if (idx != -1)
    myArray[idx] = Object.assign({}, myArray[idx], uv);
  else myArray.push(uv);
});

console.log(myArray)

【讨论】：

你确定两个数组的 idx 相同吗？？
@webdeb 不需要这样做，因为您需要循环其中一个。顺便说一句，我增强了我的支持以支持 updatedArray 有新项目的情况。

【解决方案2】：

你可以试试

 function mergeArr(arrOne, arrTwo, prop) {
        _.each(arrTwo, function(arrTwoobj) {
            var arrOneobj = _.find(arrOne, function(arrOneobj) {
                return arrOneobj[prop] === arrTwoobj[prop];
            });
            arrOneobj ? _.extend(arrOneobj, arrTwoobj) : arrOne.push(arrTwoobj);
        });
    }

    var myArray = [
      {pk: '1', person: 'person 1'}, 
      {pk: '2', person: 'someone'}, 
    ];

    var updatedArray = [
      {pk: '2', person: 'another person'}
    ];

    mergeArr(myArray, updatedArray, 'pk');
    console.log(myArray);

【讨论】：

【解决方案3】：

var myArray = [
  {pk: '1', person: 'person 1'}, 
  {pk: '2', person: 'someone'}, 
];

var updatedArray = [
  {pk: '2', person: 'another person'}
];

var exists = [];
for (item of updatedArray) {
  exists[item.pk] = true;
}
for (item of myArray) {
  if (!exists.hasOwnProperty(item.pk)) {
    updatedArray.push(item);
  }
}

console.log(updatedArray);

【讨论】：

这个答案肯定更简单。它和mortezaT发布的答案一样快吗？
我认为更快，但差异很小。

【解决方案4】：

最有效的方法是，首先从其中一个数组创建地图。然后运行一个循环并从地图中获取项目

您只需要两个函数，reduce 和 map

这种方式只需要array1.length + array2.length迭代，不需要array1.length * array2.length

// creates the map
var myMap = myArray.reduce(function(obj, item) {
  obj[item.pk] = item
}, {})

// merges updatedArray items, with the item from the map
var mergedArray = updatedArray.map(function(item) {
   return myMap[item.pk] ? Object.assign({}, myMap[item.pk], item) : item
})

【讨论】：