合并两个对象数组

var arr1 = [{ name: "lang", value: "English" }, { name: "age", value: "18" }];
var arr2 = [{ name: "childs", value: '5' }, { name: "lang", value: "German" }];

function mergeArrayByProperty(arr1, arr2, prop) {
    var newArray =
        arr1.map(item => {
            if (typeof (item[prop]) !== "undefined") {
                var nItems = arr2.filter(ni => { if (typeof (ni[prop]) !== "undefined" && ni[prop] === item[prop]) return ni; });
                if (nItems.length > 0) {
                    item = Object.assign({}, item, nItems[0]);
                }
                return item;
            }
        });
    var arr2nd = arr2.flatMap(item => { return item[prop] });
    var arr1nd = arr1.flatMap(item => { return item[prop] });
    var nonDupArr = arr2nd.map(p => { if (arr1nd.includes(p) === false) return arr2.filter(i2 => { if (i2[prop] === p) return Object.assign({}, i2) })[0]; });
    return newArray.concat(nonDupArr).filter(i=>{if(i !== null)return i})
}
var arr = mergeArrayByProperty(arr1, arr2, 'name');
console.log(arr)

此代码会在第一个数组中查找重复的键，并合并第二个数组中具有相同键值的对象。如果在第二个数组中没有找到对应的值，则使用原始对象。如您所见，lang 仅在结果集中出现一次，其值为德语。

const merge = (first, second) => {
  for(let i=0; i<second.length; i++) {
    first.push(second[i]);
  }
  return first;
}

console.log(merge([1,2,3], [4,5,6])); // [1,2,3,4,5,6]
console.log(merge(merge([1,2,3], [4,5,6]), [7,8,9])); // [1,2,3,4,5,6,7,8,9]

2. 使用 Spread 操作符

const arr1 = [1,2,3];
const arr2 = [4,5,6];

// Merge arrays
const merged = [...arr1, ...arr2];

console.log(merged); // [1,2,3,4,5,6]

const arr1 = [1,2,3];
const arr2 = [4,5,6];

// Merge arrays
const merged1 = arr1.concat(arr2); // bit confusing, seems like `arr1` itself is being modified but it's not
const merged2 = [].concat(arr1, arr2); // cleaner approach

console.log(merged1); // [1,2,3,4,5,6]
console.log(merged2); // [1,2,3,4,5,6]

const arr1A = [1,2,3];
const arr2A = [4,5,6];

const arr1B = [1,2,3];
const arr2B = [4,5,6];

const arr1C = [1,2,3];
const arr2C = [4,5,6];
const arr3C = [7,8,9];

// Merge arrays
const merged1 = arr1A.push(...arr2A);

// Merging without the ... on arr2B
const merged2 = arr1B.push(arr2B);

// Merge more than two arrays
arr1C.push(...[...arr2C, ...arr3C]);
console.log(arr1C); // [1,2,3,4,5,6,7,8,9]

console.log(merged1); // 6
console.log(arr1A); // [1,2,3,4,5,6]
console.log(arr2A); // [4,5,6]

console.log(merged2); // 4
console.log(arr1B); // [1,2,3,[4,5,6]]
console.log(arr2B); // [4,5,6]

const arr1 = [1,2,3];
const arr2 = [4,5,6];

const merged = arr2.reduce((arr, item) => {
    arr.push(item);
    return arr;    
}, arr1);

console.log(merged); // [1,2,3,4,5,6]

总之，

• 在JavaScript中，有多种合并两个或多个数组为一个数组的方法。
• 使用spread运算符或concat()方法是最优解决方案。
• 如果您确定要合并的所有输入都是数组，请使用spread操作符。如果不确定，请使用concat()方法。
• 当您想要更改要合并的输入数组之一时，可以使用push()方法来合并数组。
• 使用reduce()方法合并数组有点繁琐。

有关更多信息，请参阅详细博客此处和视频此处

const arr1 = [{ name: "lang", value: "English" }, { name: "age", value: "18" }];
const arr2 = [{ name: "childs", value: '5' }, { name: "lang", value: "German" }];

const mergeArrOfObjects = (dataset1, dataset2) => {
    const map1 = new Map();
    dataset1.map((d1, i) => {
        map1.set(d1.name, i);
    })
    for (let d2 of dataset2) {
        if (d2 && map1.has(d2.name)) {
            dataset1[map1.get(d2.name)] = d2;
        } else if(d2){
            dataset1.push(d2);
        }
    }
    return dataset1;
};

const arr3 = mergeArrOfObjects(arr1, arr2);
console.log(arr3);

就我个人而言，建议尝试使用jquery extend函数。

var arr3 = jQuery.extend(arr1,arr2....)

interface Foo {
    name: string;
    value: string;
}

var arr1: Foo[] = [
    { name: "lang", value: "English" },
    { name: "age", value: "18" },
];

var arr2: Foo[] = [
    { name: "childs", value: "5" },
    { name: "lang", value: "German" },
];

const merged: Foo[] = Array.from(
  [...arr1, ...arr2].reduce(
      (acc, curr) => acc.set(curr.name, curr),
      new Map<Foo["name"], Foo>(),
    )
    .values(),
);

// [
//   { name: "lang", value: "German" },
//   { name: "age", value: "18" },
//   { name: "childs", value: "5" },
// ];

var newArray = yourArray.concat(otherArray); console.log('Concatenated newArray: ', newArray);

var newArray = yourArray.concat(otherArray); console.log('合并后的newArray: ', newArray);

我发布这篇文章是因为与之前的答案不同，这个是通用的，没有外部库，O(n)复杂度，实际上过滤了重复项并保留了原始顺序（通过将最后匹配的元素放置在第一次出现的位置）:

function unique(array, keyfunc) {
    return array.reduce((result, entry) => {
        const key = keyfunc(entry)
        if(key in result.seen) {
            result.array[result.seen[key]] = entry
        } else {
            result.seen[key] = result.array.length
            result.array.push(entry)
        }
        return result
    }, { array: [], seen: {}}).array
}

使用方法：

var arr1 = new Array({name: "lang", value: "English"}, {name: "age", value: "18"})
var arr2 = new Array({name : "childs", value: '5'}, {name: "lang", value: "German"})

var arr3 = unique([...arr1, ...arr2], x => x.name)
/* arr3 == [ 
    {name: "lang", value: "German"}, 
    {name: "age", value: "18"},
    {name: "childs", value: "5"}
]*/

let mergeArray = arrA.filter(aItem => !arrB.find(bItem => aItem.name === bItem.name))

这里首先根据 arr2 中的元素来过滤 arr1。如果存在，则不将其添加到结果数组中，否则添加。然后将 arr2 添加到结果中。

arr1.filter(item => {
  if (!arr2.some(item1=>item.name==item1.name)) {
    return item
  }
}).concat(arr2)

const arr1 = [{ id: 1, name: 'Jack'}, { id: 2, name: 'Jack'}];
const arr2 = [{ id: 2, name: 'Jane'}, { id: 3, name: 'Rod'}];

mergeArrays(arr1, arr2, "name");
// [{ id: 1, name: 'Jack'}, { id: 2, name: 'Jane'}, { id: 3, name: 'Rod'}];

mergeArrays(arr1, arr2, "id");
// [{ id: 1, name: 'Jack'}, { id: 2, name: 'Jack'}, { id: 3, name: 'Rod'}];