本文详解JavaScript中合并对象的两种核心方式：Object.assign与ES6扩展运算符。重点解析同名属性覆盖规则、类型差异处理，并扩展讲解数组合并特性及数组属性的合并技巧，帮助开发者根据实际需求选择合适方案。
方法一：利用 Object.assign(obj1, obj2, …) 进行合并
参数1：obj1 作为目标对象 参数2：obj2 作为源对象
注意：当对象间存在同名属性时，后面对象的属性值将覆盖前面对象的属性值
const obj1 = {
a: 1,
b: 2,
}
const obj2 = {
b: 3,
c: 4,
}
const result = Object.assign(obj1, obj2)
console.log(result) // {a: 1, b: 3, c: 4}方法二：采用 ES6 新增的扩展运算符 … 【三点】语法
{…obj1, …obj2} 注意：当对象间存在同名属性时，后面对象的属性值将覆盖前面对象的属性值
const obj1 = {
a: 1,
b: 2,
}
const obj2 = {
b: 3,
c: 4,
}
const result = {...obj1, ...obj2} // 返回一个新的对象。
console.log(result) // {a: 1, b: 3, c: 4}
// 顺带一提， 数组之间的合并，也可以使用 扩展运算符 .
// 如： [...arr1, ...arr2]
知识扩展：
扩展运算符 … 【三点】同样适用于数组之间的合并操作。
区别在于： 数组合并时仅进行拼接，即使值相同也不会发生覆盖。（这与对象合并机制不同。）
let arr1 = [1,2,4]
let arr2 = [4,5,6]
let arr3 = [...arr1, ...arr2]
console.log(arr3) // [1, 2, 4, 4, 5, 6] 最后需提醒，若合并对象中同名属性类型不同（如字符串与数值），后者会覆盖前者，因此需根据项目需求进行相应处理。
此外，若需对合并后的属性值进行特殊处理（如将属性值合并为新数组），可使用 Array.concat() 方法。
const obj1 = { a: [1, 2] };
const obj2 = { a: [3, 4] };
const obj3 = Object.assign({}, obj1, {
a: obj1.a.concat(obj2.a)
});
console.log(obj3); // { a: [1, 2, 3, 4] }
或者使用扩展运算符
const obj1 = { a: [1, 2] };
const obj2 = { a: [3, 4] };
const obj3 = {...obj1, a: [...obj1.a, ...obj2.a]}
console.log(obj3); // { a: [1, 2, 3, 4] }此外，若需对合并后的属性值进行进一步处理（如去重、排序等），可使用 Array.filter()、Array.sort() 等方法。
总结：
到此这篇关于javaScript合并对象的多种方式及知识扩展的文章就介绍到这了,更多相关js合并对象方式内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站！