JavaScript 创建数组独立副本的正确方法

在 JavaScript 中，数组是引用类型，直接赋值只会创建指向同一内存地址的别名，导致“副本”随原数组意外变动；本文清晰揭示了这一常见陷阱，并重点推荐使用展开运算符（[...arr]）、slice() 或 Array.from() 等方法实现安全、高效的浅拷贝——既确保两个数组完全独立、互不干扰，又兼顾简洁性与兼容性，同时提醒读者注意浅拷贝的局限性及嵌套结构下深拷贝的必要性，助你真正掌握数组快照式复制的核心实践。

在 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()（兼容性好）

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 成为一份快照式的独立副本。

到这里，我们也就讲完了《JavaScript 创建数组独立副本的正确方法》的内容了。个人认为，基础知识的学习和巩固，是为了更好的将其运用到项目中，欢迎关注golang学习网公众号，带你了解更多关于的知识点！