对象扩展运算符简介
ES6 引入了对象扩展运算符 ...，它允许我们轻松地复制和合并对象。在 ES9 (ECMAScript 2018) 中，这个特性得到了进一步标准化。基本用法如下：
javascript
const obj1 = { a: 1, b: 2 };
const obj2 = { c: 3, d: 4 };
const merged = { ...obj1, ...obj2 };
// 结果: { a: 1, b: 2, c: 3, d: 4 }浅合并与深合并
对象扩展运算符执行的是浅合并(shallow merge)，这意味着它只会复制对象的第一层属性：
javascript
const obj1 = { a: 1, nested: { b: 2 } };
const obj2 = { ...obj1 };
obj2.nested.b = 3;
console.log(obj1.nested.b); // 3 - 原始对象也被修改了深层合并的问题
当我们需要合并嵌套对象时，简单的扩展运算符就无法满足需求了：
javascript
const obj1 = { a: 1, nested: { b: 2, c: 3 } };
const obj2 = { nested: { b: 4, d: 5 }, e: 6 };
const merged = { ...obj1, ...obj2 };
// 结果: { a: 1, nested: { b: 4, d: 5 }, e: 6 }
// 注意: nested.c 丢失了实现深层合并的解决方案
1. 手动递归合并
javascript
function deepMerge(target, source) {
for (const key in source) {
if (source[key] instanceof Object && target[key]) {
Object.assign(source[key], deepMerge(target[key], source[key]));
}
}
return { ...target, ...source };
}2. 使用第三方库
许多流行的库提供了深合并功能：
- Lodash 的
_.merge - jQuery 的
$.extend(true, {}, obj1, obj2) - Ramda 的
R.mergeDeepLeft或R.mergeDeepRight
3. JSON 方法（简单但有限）
javascript
const merged = JSON.parse(JSON.stringify(obj1));
Object.assign(merged, JSON.parse(JSON.stringify(obj2)));性能考虑
深层合并比浅合并消耗更多资源，特别是对于大型对象。在性能敏感的场景中，应该：
- 评估是否真的需要深层合并
- 考虑使用不可变数据结构
- 对于频繁更新，考虑使用专门的状态管理库
实际应用场景
- 配置合并：合并默认配置和用户自定义配置
- 状态管理：如 Redux 中的状态更新
- 数据转换：合并来自不同API的数据源
结论
ES9 的对象扩展运算符提供了便捷的对象合并方式，但其浅合并特性在处理嵌套对象时存在局限。理解这一特性有助于我们在实际开发中选择合适的合并策略，避免潜在的数据丢失或意外修改问题。对于复杂场景，考虑使用专门的深合并工具或实现自定义合并逻辑。
