对象合并与拷贝方法_浅拷贝与深拷贝实现

答案是浅拷贝仅复制对象第一层属性,深拷贝递归复制所有层级。常用浅拷贝方法有Object.assign()和扩展运算符;深拷贝可使用JSON.parse(JSON.stringify())或递归实现,以避免引用共享导致的数据污染。

在JavaScript中,对象的合并与拷贝是开发中常见的操作。由于对象是引用类型,直接赋值只会复制引用,修改新对象会影响原对象。因此需要通过浅拷贝或深拷贝来实现数据隔离。

浅拷贝实现方式

浅拷贝只复制对象的第一层属性,如果属性值是对象,则复制的是引用。

常用方法包括:
  • Object.assign():将多个源对象的可枚举属性复制到目标对象
  • 扩展运算符(...):语法简洁,适合单层对象合并
  • Array.prototype.slice():适用于数组的浅拷贝

示例:

const obj1 = { a: 1, b: { c: 2 } };
const obj2 = Object.assign({}, obj1);
// 或 const obj2 = { ...obj1 };

obj2.b.c = 3;
console.log(obj1.b.c); // 输出 3,说明内部对象被共享

深拷贝实现方式

深拷贝会递归复制对象的所有层级,完全断开引用关系。

常见实现方法:
  • JSON.parse(JSON.stringify()):简单有效,但有局限性(如无法处理函数、undefined、循环引用等)
  • 递归遍历实现:手动判断类型并递归复制,灵活性高
  • 使用第三方库(如 Lodash):提供成熟的 _.cloneDeep() 方法

基础递归深拷贝实现:

function deepClone(obj, visited = new WeakMap()) {
  if (obj === null || typeof obj !== 'object') return obj;
  if (visited.has(obj)) return visited.get(obj); // 处理循环引用

  let clone;
  if (Array.isArray(obj)) {
    clone = [];
  } else {
    clone = {};
  }

  visited.set(obj, clone);

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

对象合并操作

对象合并常用于配置项覆盖、状态更新等场景。

  • 使用 Object.assign(){...obj1, ...obj2} 实现浅层合并
  • 若需深层合并,需自定义逻辑或使用工具函数

示例:

const defaults = { timeout: 5000, retry: 3 };
const options = { timeout: 2000 };
const config = { ...defaults, ...options }; // { timeout: 2000, retry: 3 }

基本上就这些。理解浅拷贝与深拷贝的区别,能帮助我们避免意外的数据污染。选择合适的方法取决于具体需求,比如性能要求、数据结构复杂度等。