合并 2 个保持内部元素数组值的数组答案

【问题标题】：Merge 2 arrays keeping inner elements array values合并 2 个保持内部元素数组值的数组
【发布时间】：2020-08-12 19:09:34
【问题描述】：

我正在尝试合并 2 个在其中一个元素中包含数组的对象。当使用扩展语法并且第一个对象数组被第二个对象数组替换时，我没有达到disered 的结果。对象如下：

const objectA1 = {
    keyA1:'valueA1',
    keyArr:[{
            arrKeyA01:'arrValueA01',
            arrKeyA02:'arrValueA02',
        },
        {
            arrKeyA11:'arrValueA11',
            arrKeyA12:'arrValueA12',
        }
    ]
}

const objectB1 = {
    keyB1:'valueB1',
    keyArr:[{
            arrKeyB01:'arrValueB01',
            arrKeyB02:'arrValueB02',
        },
        {
            arrKeyB11:'arrValueB11',
            arrKeyB12:'arrValueB12',
        }
    ]
}

我想得到：

const objectRes = {
    keyA1:'valueA1',
    keyB1:'valueB1',
    keyArr:[{
            arrKeyA01:'arrValueA01',
            arrKeyA02:'arrValueA02',
            arrKeyB01:'arrValueB01',
            arrKeyB02:'arrValueB02',
        },
        {
            arrKeyA11:'arrValueA11',
            arrKeyA12:'arrValueA12',
            arrKeyB11:'arrValueB11',
            arrKeyB12:'arrValueB12',
        }
    ]
}

我用的是

{...objectA1 ,...objectB1}

但如前所述，keyArr 不保留objectA1 元素。

如何合并两个对象并使用扩展语法保留数组数据？

感谢您的任何评论/帮助:)

【问题讨论】：

您需要明确说明您希望如何创建keyArr 属性。仅传播语法不会让您到达那里。

标签： javascript arrays object spread-syntax

【解决方案1】：

创建一个对象并放置来自 A1 和 B2 对象的前 2 个值。使用reduce单独自定义数组

const objectA1 = {
  keyA1: 'valueA1',
  keyArr: [{
      arrKeyA01: 'arrValueA01',
      arrKeyA02: 'arrValueA02',
    },
    {
      arrKeyA11: 'arrValueA11',
      arrKeyA12: 'arrValueA12',
    }
  ]
}

const objectB1 = {
  keyB1: 'valueB1',
  keyArr: [{
      arrKeyB01: 'arrValueB01',
      arrKeyB02: 'arrValueB02',
    },
    {
      arrKeyB11: 'arrValueB11',
      arrKeyB12: 'arrValueB12',
    }
  ]
}

const arr = objectA1.keyArr.reduce((acc, x) => {
  const res1 = objectB1.keyArr.reduce((acc2, y) => ({...x,...y}), {})
  return acc = [...acc, res1];
}, [])

const result = {
  keyA1: objectA1.keyA1,
  keyB1: objectB1.keyB1,
  keyArr: arr
}

console.log(result)

【讨论】：

这是一个非常好的reduce实现，我没想到。

【解决方案2】：

我想分享我解决这个问题的尝试，我使用循环将数组合并为一个：

const objectA1 = {
  keyA1:'valueA1',
  keyArr:[{
     arrKeyA01:'arrValueA01',
     arrKeyA02:'arrValueA02',
     },
     {
     arrKeyA11:'arrValueA11',
     arrKeyA12:'arrValueA12',
     }
 ]
 }

  const objectB1 = {
      keyB1:'valueB1',
      keyArr:[{
              arrKeyB01:'arrValueB01',
              arrKeyB02:'arrValueB02',
          },
          {
              arrKeyB11:'arrValueB11',
              arrKeyB12:'arrValueB12',
          }
      ]
  }
objects = [objectA1, objectB1];
let i = 0;
new_array = {};
for(i; i < objects.length; i++){
  object = objects[i];
  keys = Object.keys(object);
  for(j = 0; j < keys.length; j++){
    //if property already exists, example keyArr
    this_key = keys[j];
    console.log(this_key);
    if(new_array[this_key] != undefined){
      //loop through that property in the object
      object[this_key].forEach((object_value, index) => {
        //add all properties that previous object did not have
        Object.assign(new_array[this_key][index], object_value);
      });
    }else{
      //initialize that value with the first element array
      new_array[this_key] = object[this_key];
    }
  }
}
console.log(objects);
console.log(new_array);

【讨论】：