JavaScript 中展开运算符（…）执行的是浅拷贝而非深拷贝

javaScript 展开运算符对对象仅做一层浅拷贝：基本类型值被独立复制，而嵌套对象仍共享引用；因此修改原始对象的深层属性（如 x.address.city）会同步影响拷贝对象，但修改顶层属性（如 x.name）则不会。

javascript 展开运算符对对象仅做一层浅拷贝：基本类型值被独立复制，而嵌套对象仍共享引用；因此修改原始对象的深层属性（如 `x.address.city`）会同步影响拷贝对象，但修改顶层属性（如 `x.name`）则不会。

在 javascript 中，展开运算符（…）常被误认为能实现“完整复制”，但实际上它只执行浅拷贝（shallow copy）。这意味着：

• 对象的一级属性中，原始类型（如字符串、数字、布尔值）会被真正复制，各自拥有独立内存；
• 但引用类型（如对象、数组、函数）仅复制其内存地址（即引用），新旧对象仍指向同一底层数据结构。

以下代码清晰展示了这一行为：

const x = {   name: "ABC",   email: "abc@example.com",   mob: "12345",   address: {     city: "Mumbai",     state: "Maharashtra"   } };  const y = { ...x }; // 浅拷贝：仅复制 x 的第一层属性  x.name = "XYZ"; // 修改顶层原始类型 → y.name 不受影响 console.log(x.name, y.name); // 输出：XYZ ABC  x.address.city = "Pune"; // 修改嵌套对象属性 → y.address 与 x.address 指向同一对象 console.log(x.address.city, y.address.city); // 输出：Pune Pune

? 关键解析：

• y = { …x } 等价于创建一个新对象，并逐个赋值 y.name = x.name、y.address = x.address；
• x.name 是字符串（原始类型），赋值时发生值拷贝；
• x.address 是对象（引用类型），赋值时仅拷贝指针，y.address 和 x.address 共享同一内存地址。

✅ 如何实现真正的深拷贝？
现代浏览器推荐使用原生 API structuredClone()（ES2022+），它支持大多数可序列化值（包括嵌套对象、数组、date、map、Set 等），且语义安全、性能良好：

const y = structuredClone(x); // ✅ 深拷贝，完全隔离 x.address.city = "Pune"; console.log(y.address.city); // Mumbai —— 不受影响

⚠️ 注意事项：

立即学习“Java免费学习笔记（深入）”；

• structuredClone() 不支持函数、undefined、symbol、循环引用、dom 节点或不可克隆对象（如 Error 实例）；遇到不支持类型会抛出 DataCloneError；
• 若需兼容旧环境（如 Node.js
• 切勿用 Object.assign({}, obj) 或展开运算符替代深拷贝——它们本质相同，均为浅拷贝。

? 总结：展开运算符是高效便捷的浅拷贝工具，适用于扁平对象或明确知晓嵌套结构无需隔离的场景；一旦涉及多层嵌套或需状态解耦，务必选用 structuredClone() 或其他深拷贝方案，避免隐式引用带来的副作用。