JavaScript 中如何正确创建数组的独立副本以避免引用共享问题-js教程-PHP中文网

JavaScript 中如何正确创建数组的独立副本以避免引用共享问题

在 javascript 中，直接赋值数组会创建引用而非副本，导致修改原数组时“副本”同步变化；使用展开运算符（[...arr]）、slice() 或 array.from() 等方法可实现浅拷贝，确保两个数组互不影响。

在 javascript 中，直接赋值数组会创建引用而非副本，导致修改原数组时“副本”同步变化；使用展开运算符（[...arr]）、slice() 或 array.from() 等方法可实现浅拷贝，确保两个数组互不影响。

JavaScript 中的数组是引用类型（reference type）。当你执行 const oneArray = myArray 时，并未创建新数组，而是让 oneArray 指向与 myArray 完全相同的内存地址。因此，后续对 myArray 的任何可变操作（如 .pop()、.push()、.splice() 或直接修改索引项）都会反映在 oneArray 上——即使你用 const 声明，也仅阻止变量重新赋值，无法冻结其指向的对象。

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

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

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

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

2. Array.prototype.slice()（兼容性好）

Java Maven Code Review

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

下载

const oneArray = myArray.slice(); // 等价于 slice(0)

3. Array.from()（语义清晰，支持类数组）

const oneArray = Array.from(myArray);

⚠️ 注意事项：

上述方法均为浅拷贝，适用于一维数组或仅需复制第一层引用的场景；若数组包含对象或嵌套数组（如 [1, {name: 'Alice'}, [4,5]]），内部对象仍为引用，需使用深拷贝（如 JSON.parse(JSON.stringify(arr)) 或结构化克隆 structuredClone(arr)）；
避免使用 const oneArray = myArray 或 let oneArray = myArray 直接赋值，这是常见误区；
Object.freeze(myArray) 可防止修改，但不解决“副本”问题，且无法冻结嵌套对象。

总结：要真正“记录数组在某一时刻的状态”，关键不是声明方式（let/const），而是切断引用关系。优先使用 [...myArray] —— 简洁、可读、符合现代 JS 实践，让 oneArray 成为一份快照式的独立副本。