在JavaScript中,当你使用concat
方法来合并两个或多个数组时,如果这些数组中有相同的键(在对象数组中),那么这些键的值将会被新数组中的相应元素覆盖。这是因为concat
方法在合并数组时会创建一个新的数组,而不会修改原来的数组。
concat
方法:用于合并两个或多个数组,并返回一个新数组。concat
方法不会改变现有的数组,而是返回一个新数组。let arr1 = [{id: 1, name: 'Alice'}, {id: 2, name: 'Bob'}];
let arr2 = [{id: 2, name: 'Bobby'}, {id: 3, name: 'Charlie'}];
let combinedArray = arr1.concat(arr2);
console.log(combinedArray);
// 输出: [{id: 1, name: 'Alice'}, {id: 2, name: 'Bob'}, {id: 2, name: 'Bobby'}, {id: 3, name: 'Charlie'}]
在这个例子中,arr1
和arr2
都是对象数组,它们都有一个键为id
的对象。当我们使用concat
方法合并这两个数组时,由于id
键的值相同,新数组中id
为2的对象是arr2
中的{id: 2, name: 'Bobby'}
。
如果你希望在合并数组时保留所有具有相同键的对象,而不是被覆盖,你可以使用以下方法:
function mergeArraysByKey(arrays, key) {
return arrays.reduce((acc, array) => {
array.forEach(item => {
let existingItem = acc.find(accItem => accItem[key] === item[key]);
if (existingItem) {
// 如果找到了相同键的对象,可以选择合并它们的属性
Object.assign(existingItem, item);
} else {
// 如果没有找到相同键的对象,直接添加到累加器数组中
acc.push(item);
}
});
return acc;
}, []);
}
let mergedArray = mergeArraysByKey([arr1, arr2], 'id');
console.log(mergedArray);
// 输出: [{id: 1, name: 'Alice'}, {id: 2, name: 'Bobby'}, {id: 3, name: 'Charlie'}]
在这个自定义的mergeArraysByKey
函数中,我们使用了reduce
方法来遍历所有的数组,并使用find
方法来检查累加器数组中是否已经存在具有相同键的对象。如果存在,我们可以选择合并它们的属性;如果不存在,我们就将当前对象添加到累加器数组中。
通过这种方式,你可以确保即使在合并具有相同键的对象数组时,也不会丢失任何数据。
领取专属 10元无门槛券
手把手带您无忧上云