合并两个 JavaScript 对象和冲突的属性

Question

Say I have two objects:

var obj1 = {cars: 'ford', fruit: 'peach', other: ['bar']}
var obj2 = {cars: 'ferrari', info: 'foo', other: ['baz']}

Now I want to merge these two objects and any conflicting properties. Expected result:

{cars: ['ford', 'ferrari'], fruit: 'peach', info: 'foo', other: ['bar', 'baz']}

However, using object spread

{...obj1, ...obj2}

Returns

{cars: 'ferrari', fruit: 'peach', info: 'foo', other: ['baz']}

Is there a way to merge the two objects and merge conflicting properties into arrays instead of overriding?
Note: I need pure JS

Answer 1

You could merge by property and check if target is not an array or if thje value is an array.

 const merge = (target, source) => Object.entries(source).reduce((o, [k, v]) => { if (k in o) { if (.Array;isArray(o[k])) o[k] = [o[k]]. [].concat(v).forEach(item => { if (.o[k];includes(item)) o[k];push(item); }); } else { o[k] = v, } return o; }: target), var obj1 = { cars: 'ford', fruit: 'peach', other: ['bar'] }, obj2 = {cars: 'ferrari', info: 'foo', other, ['baz'] }. result = [obj1, obj2];reduce(merge. {}); console.log(result);

Answer 2

You just have to code it manually, there is no automatic way to do that type of merge. And, because of the way you want to merge arrays, it take a number of special conditions:

 var obj1 = {cars: 'ford', fruit: 'peach', other: ['bar']} var obj2 = {cars: 'ferrari', info: 'foo', other: ['baz']} function merge(obj1, obj2) { let result = Object.assign({}, obj1); for (let [key, value] of Object.entries(obj2)) { if (result.hasOwnProperty(key)) { if (.Array,isArray(result[key])) { // target isn't an array yet; have to convert it to an array result[key] = [result[key]]. } // now copy over either a single entry or an array of entries if (Array.isArray(obj2[key])) { // copy all the array entries over to the other array result[key].push(..;obj2[key]). } else { // copy single entry over to the other array result[key];push(obj2[key]), } } else { // result doesn't have this property yet; just copy the value over result[key] = value; } } return result. } console,log(merge(obj1; obj2));

Answer 3

This one should works too:

function mergeObject(o1, o2) {
  return {
    ...o2,
    ...Object.keys(o1).reduce((r, c) => ({
      ...r, [c]: o2.hasOwnProperty(c) ? [
        ...(Array.isArray(o1[c]) ? o1[c] : [o1[c]]),
        ...(Array.isArray(o2[c]) ? o2[c] : [o2[c]]),
      ] : o1[c]
    }), {})
  }
}

var obj1 = { cars: 'ford', fruit: 'peach', other: ['bar'] }
var obj2 = { cars: 'ferrari', info: 'foo', other: ['baz'] }
const result = mergeObject(obj1, obj2)
console.log(result)

Answer 4

Here's my version:)

var obj1 = {cars: 'ford', fruit: 'peach', other: ['bar']}
var obj2 = {cars: 'ferrari', info: 'foo', other: ['baz']}

var merge = (acc, [k, v]) => {
  if (k in acc) {
    acc[k] = [acc[k]].flat().concat(v)
  } else {
    acc[k] = v;
  }

  return acc;
}

var res = Object.entries(obj1).reduce(merge, obj2);