在 JavaScript 中,Object.assign()
和扩展运算符(...
)都是浅拷贝(Shallow Copy)。它们只复制对象的第一层属性,不会递归复制嵌套的对象。
一、浅拷贝的特征:
- 第一层属性是值复制(基本类型直接复制值,引用类型复制地址引用)
- 嵌套对象是引用共享(修改嵌套对象会影响原对象)
二、验证示例:
const obj = {
name: "John",
address: { city: "New York" }
};
// 使用 Object.assign
const copy1 = Object.assign({}, obj);
// 使用扩展运算符
const copy2 = { ... obj };
// 修改第一层属性(互不影响)
copy1.name = "Alice";
console.log(obj.name); // "John" (不变)
// 修改嵌套对象(会相互影响)
copy1.address.city = "London";
console.log(obj.address.city); // "London" (原对象被修改)
三、Object.assign 和扩展运算符的区别:
特性 | Object.assign() | 扩展运算符 ... |
---|---|---|
基本功能 | 合并对象到目标对象 | 展开对象/数组的属性 |
原型链属性 | 不复制原型链上的属性 | 不复制原型链上的属性 |
Symbol 属性 | 可以复制 | 可以复制 |
属性覆盖顺序 | 后传入的覆盖同名属性 | 后展开的覆盖同名属性 |
数组合并 | 不支持 | 支持([...arr1, ...arr2] ) |
空值处理 | 忽略 null /undefined 源对象 | 抛出错误 |
函数调用方式 | Object.assign(target, ...sources) | 字面量内部 { ...obj } |
四、深拷贝的解决方案
如果需要完全独立的副本,需使用深拷贝:
- 手动递归克隆
JSON.parse(JSON.stringify(obj))
(注意:会丢失函数/Symbol/undefined 等)- 三方库
如 Lodash 的_.cloneDeep(obj)
五、关键总结
- ✅ 两者都是浅拷贝:只复制第一层,嵌套对象共享引用
- 🚫 不是深拷贝:无法创建嵌套对象的独立副本
- 📌 优先使用扩展运算符(语法更简洁,是 JS 标准)
- ⚠️ 嵌套对象需要额外处理才能实现深拷贝