17370845950

浅拷贝只复制对象第一层，嵌套属性共享同一引用，常用方法有Object.assign()和扩展运算符；深拷贝递归复制所有层级，完全隔离数据，可使用JSON.parse(JSON.stringify())或递归实现，推荐Lodash的cloneDeep处理复杂场景。

JavaScript中对象拷贝是数据操作的常见需求，尤其在状态管理、函数式编程和避免副作用时尤为重要。直接赋值不会创建新对象，而是引用原对象，修改会影响原始数据。为避免这类问题，需要进行对象拷贝。根据拷贝深度不同，分为浅拷贝和深拷贝。

浅拷贝（Shallow Copy）

浅拷贝只复制对象的第一层属性，如果属性值是基本类型，会复制其值；如果是引用类型（如数组、对象），则复制的是引用地址，因此嵌套对象仍共享同一内存空间。

常用实现方式包括：

• Object.assign()：将一个或多个源对象的所有可枚举属性复制到目标对象
• 扩展运算符（...）：语法简洁，推荐用于简单场景

const obj = { a: 1, b: { c: 2 } };
const copy1 = Object.assign({}, obj);
const copy2 = { ...obj };

copy1.a = 10;
copy1.b.c = 20;

console.log(obj.b.c); // 20，说明嵌套对象被共用

深拷贝（Deep Copy）

深拷贝会递归复制对象的所有层级，生成完全独立的新对象。适用于嵌套结构复杂、需彻底隔离原数据的场景。

实现方式有多种，各有优劣：

• JSON.parse(JSON.stringify(obj))：简单快捷，但有局限性，如不支持函数、undefined、Symbol、循环引用等
• 递归遍历实现：可定制化强，能处理大多数类型，但需注意性能和边界情况
• 使用第三方库（如 Lodash 的 cloneDeep）：功能完整，稳定可靠

// 使用 JSON 方法（注意限制）
const deepCopy = JSON.parse(JSON.stringify(obj));

// 简易递归实现（基础版本）
function deepClone(obj, hash = new WeakMap()) {
  if (obj == null || typeof obj !== 'object') return obj;
  if (hash.has(obj)) return hash.get(obj); // 处理循环引用

  const clone = Array.isArray(obj) ? [] : {};
  hash.set(obj, clone);

  for (let key in obj) {
    if (obj.hasOwnProperty(key)) {
      clone[key] = deepClone(obj[key], hash);
    }
  }
  return clone;
}

注意事项与选择建议

实际开发中应根据具体需求选择合适的拷贝方式：

• 若对象结构简单且不含函数、特殊值，扩展运算符足够用
• 需兼容旧环境时可用 Object.assign
• 对嵌套数据且要求完全隔离，优先考虑 深拷贝
• 项目中频繁使用建议引入 Lodash 等工具库
• 注意性能开销，避免在高频操作中执行复杂深拷贝

基本上就这些，掌握浅拷贝与深拷贝的区别和实现方式，能有效提升 JavaScript 数据操作的安全性和可靠性。