数组变量深度克隆的核心目标是生成内容完全一致且所有嵌套值均为全新内存地址的独立副本；浅拷贝仅复制最外层数组，内部引用类型仍共享地址，导致修改联动；structuredclone()是现代首选方案，支持多种类型并处理循环引用，但不支持函数、undefined等；兼容旧环境推荐lodash的_.clonedeep()；浅拷贝适用于元素全为基本类型或确认不修改嵌套对象的场景。
数组变量深度克隆的核心目标，是生成一个**内容完全一致、所有嵌套值均为全新内存地址**的独立副本。只要存在任何一层引用共享，修改副本就可能意外污染原始数据——这是前端开发中高频踩坑点。
为什么浅拷贝会“联动”修改？
JavaScript 中数组是引用类型。浅拷贝（如 [...arr]、arr.slice()、Array.from(arr)）只新建最外层数组实例，内部若含对象、日期、正则、嵌套数组等，仍指向原内存地址：
-
arr = [1, {x: 2}]→copy = [...arr] -
copy[1].x = 99→arr[1].x同步变为 99
现代标准方案：structuredClone() 是首选
ECMAScript 原生 API，支持 Date、RegExp、Map、Set、ArrayBuffer、TypedArray、嵌套对象/数组，保留类型与行为，且自动处理循环引用：
- ✅ 浏览器：Chrome 98+、Firefox 94+、Safari 15.4+
- ✅ Node.js：18.16+ / 20.6+ 稳定支持（无需 flag）
- ❌ 不支持函数、undefined、Symbol、WeakMap/WeakSet（与规范一致）
用法极简：const deepCopy = structuredClone(originalArray);
兼容旧环境的可靠替代方案
当需支持 IE 或老旧 Node 版本时，避免使用 JSON.parse(JSON.stringify())（丢失 Date/RegExp/函数/undefined/循环引用）：
- 推荐 Lodash 的
_.cloneDeep()：成熟、健壮、覆盖边界情况 - 手写递归深拷贝需额外处理：Date、RegExp、Map/Set、循环引用（WeakMap 缓存已克隆对象）
- MessageChannel 可用于跨上下文深拷贝（如主线程 ↔ Web Worker），但属异步，不适用于同步逻辑
什么情况下浅拷贝就够用？
并非所有场景都需要深拷贝。以下情形用展开运算符或 slice() 完全安全：
- 数组元素全是基本类型（number/string/boolean/null）
- 仅需隔离一维结构，且确认后续不会修改嵌套对象
- 性能敏感场景（如每帧处理大量简单数组），深拷贝开销明显更高
