手写实现深拷贝deepClone(考虑循环引用引入weakMap())

最新推荐文章于 2025-06-03 11:32:36 发布

原创最新推荐文章于 2025-06-03 11:32:36 发布 · 687 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #es6

本文介绍了在JavaScript中如何处理对象的深度克隆问题，特别是针对循环引用的解决方案，利用WeakMap缓存已复制的对象，以提高性能并避免内存泄漏。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

var obj1 = {   //原数据，包含字符串、对象、函数、数组等不同的类型
  name:"test",
  main:{
      a:1,
      b:2
  }
}
obj1.obj1 = obj1 //nested循环引用

// 解决循环引用，加个new WeakMap的Cache
// WeakMap 的键是弱引用，告诉 JS 垃圾回收机制，当键回收时，对应 WeakMap 也可以回收，更适合大量数据深拷
const deepClone = (obj, weakMap = new WeakMap())=>{
  if(typeof obj === 'object'){
    //A-----
    if(weakMap.has(obj)) return weakMap.get(obj)

    const newObj = Array.isArray(obj) ? []: {}
    
    // B----
    weakMap.set(obj, newObj)

    for(const prop in obj){
      newObj[prop] = deepClone(obj[prop], weakMap)
    }
    return newObj
  }else{
    return obj
  }
}

// 基础版本
// const deepClone = (obj)=>{
//   if(typeof obj !== 'object' && obj !== null){
//     return obj
//   }else{
//     let newObj = Array.isArray(obj) ? [] : {};
//     for(let prop in obj){
//       newObj[prop] = typeof obj[prop] === 'object' ? deepClone(obj[prop]) : obj[prop]
//     }
//     return newObj
//   }
// }

const obj2 = deepClone(obj1)
obj2.main.a = 99999
console.log("obj1", obj1)
console.log("obj2", obj2)