JavaScript对象深拷贝大揭秘——让对象学会“分身术”！

在JavaScript的奇幻世界里，对象们总是想要点新鲜感，比如学会自我复制，来个华丽的“分身术”。但别担心，作为编程界的魔术师，我们今天就来揭秘如何让JavaScript对象轻松实现深拷贝，让它们也能拥有自己的“克隆体”！

魔法函数：deepClone登场！

首先，我们要准备一个神奇的函数deepClone，它就像一把钥匙，能打开对象深拷贝的神秘之门。准备好了吗？让我们一起见证奇迹！

javascript复制代码

function deepClone(obj, hash = new WeakMap()) {  
    // 基础检查：非对象直接返回，避免克隆基本类型  
    if (obj === null || typeof obj !== 'object') {  
        return obj;  
    }  
  
    // 魔法镜：检查是否已有克隆体，避免循环引用  
    if (hash.has(obj)) {  
        return hash.get(obj);  
    }  
  
    // 施展魔法：根据类型创建克隆体  
    let cloneObj = Array.isArray(obj) ? [] : {};  
    hash.set(obj, cloneObj); // 标记为已克隆  
  
    // 复制属性：对每个属性施展“分身术”  
    for (let key in obj) {  
        if (obj.hasOwnProperty(key)) {  
            cloneObj[key] = deepClone(obj[key], hash); // 递归调用，继续克隆  
        }  
    }  
  
    // 见证奇迹的时刻：返回克隆体  
    return cloneObj;  
}  
  
// 示例对象：一个拥有复杂结构的魔法师  
const wizard = {  
    name: "甘道夫",  
    spells: ["火球术", "闪电链", "隐身术"],  
    equipment: {  
        staff: "长者之杖",  
        robe: "法师长袍"  
    },  
    // 假设这里还有个函数，但函数不会被直接克隆为相同函数，而是保留其存在  
    castSpell: function() { console.log("咒语已释放！"); }  
};  
  
// 施展“分身术”  
const wizardClone = deepClone(wizard);  
  
// 测试：修改克隆体，看原对象是否受影响  
wizardClone.name = "萨鲁曼";  
wizardClone.spells.push("时间停止"); // 注意：这里数组是浅拷贝的示例，内部元素仍为引用  
wizardClone.equipment.staff = "黑暗魔杖"; // 这里的对象被深拷贝了  
  
console.log(wizard.name); // 甘道夫，未受影响  
console.log(wizard.spells); // 原始数组，但注意：我们向克隆体的数组添加了元素  
console.log(wizard.equipment.staff); // 长者之杖，已受影响（因为equipment对象内部被深拷贝了）  
  
// 调用函数看看，只是验证函数存在，不会真正“克隆”函数行为  
wizard.castSpell(); // 咒语已释放！

工作原理大揭秘！

1. 基础检查：首先，我们检查要克隆的项是否为基本类型（如数字、字符串、布尔值等）或null。如果是，直接返回它，因为基本类型没有引用问题，不需要深拷贝。

2. 魔法镜：使用WeakMap作为“魔法镜”，记录已经克隆过的对象。这是为了防止循环引用导致的无限递归。如果对象已经在“魔法镜”中存在，就直接返回其克隆体。

3. 施展魔法：根据原对象的类型（数组或普通对象），创建一个新的空对象作为克隆体，并将其标记为已克隆。

4. 复制属性：遍历原对象的所有可枚举属性，对每个属性递归调用deepClone函数进行克隆，并将克隆结果赋值给克隆对象的相应属性。这样，即使原对象的属性是对象或数组，也能被正确地深拷贝。

5. 见证奇迹：最后，返回克隆好的对象。现在，你拥有了一个与原对象结构相同但完全独立的新对象！

通过上面的魔法函数，JavaScript对象也能轻松学会“分身术”，实现自我深拷贝啦！希望这个揭秘能让你在编程的道路上更加得心应手，笑对挑战!