JavaScript 中如何正确复制数组以避免引用共享问题-js教程-PHP中文网

JavaScript 中如何正确复制数组以避免引用共享问题

在 javascript 中，直接赋值数组会创建引用而非副本，导致修改原数组时副本同步变化；使用扩展运算符（...）或 array.from() 等方法可实现浅拷贝，确保两个数组独立操作。

在 javascript 中，直接赋值数组会创建引用而非副本，导致修改原数组时副本同步变化；使用扩展运算符（...）或 array.from() 等方法可实现浅拷贝，确保两个数组独立操作。

JavaScript 中的数组是引用类型（reference type），这意味着变量存储的并非数组本身，而是指向内存中该数组对象的引用。因此，当你执行 const oneArray = myArray 时，并未创建新数组，只是让 oneArray 指向与 myArray 相同的内存地址。后续对 myArray 的任何可变操作（如 .pop()、.push()、.splice() 或直接索引赋值）都会反映在 oneArray 上——因为它们操作的是同一个底层对象。

✅ 正确做法：使用浅拷贝（shallow copy）创建独立副本。以下是几种常用且推荐的方式：

1. 扩展运算符（最简洁、现代）

let myArray = [1, 2, 3];
const oneArray = [...myArray]; // 创建新数组，内容相同但内存独立

myArray.pop(); // 修改 myArray
console.log(myArray);    // [1, 2]
console.log(oneArray); // [1, 2, 3] ← 保持不变 ✅

2. Array.from() 方法

Java Maven Code Review

审查Java Maven项目（ZIP压缩包或GitLab仓库URL），检查代码规范、命名、模块边界、可维护性问题以及重复代码。

下载

const oneArray = Array.from(myArray);

3. slice()（兼容性好，但语义稍弱）

const oneArray = myArray.slice(); // 无参数时返回完整副本

⚠️ 注意事项：

上述方法均为浅拷贝：若数组元素包含对象或嵌套数组（如 [1, {name: 'Alice'}, [4, 5]]），内部对象仍为引用共享。需深拷贝时应使用 structuredClone()（现代环境）或序列化方案（如 JSON.parse(JSON.stringify(arr))，但不支持函数、undefined、Date 等）。
const 只保证变量绑定不可重新赋值，不冻结对象内容——你仍可修改 const arr = [1,2,3]; arr.push(4)。如需完全不可变，应配合 Object.freeze()（仅冻结第一层）或使用不可变数据结构库（如 Immer）。

总结：要“记录数组某一时刻的状态”，关键不是声明方式（let/const），而是显式拷贝。优先使用 [...arr]，语义清晰、性能良好、可读性强，是现代 JavaScript 数组快照的标准实践。