如何复制 JavaScript 数组 - JavaScript

JavsScript 数组是一个非常常见的数据结构。当我们需要在代码中对数组进行一些操作时，有时我们需要复制整个数组并将其传递到另一个函数中。在这篇文章中，我们将讨论如何复制 JavaScript 数组。

1. 使用 slice() 方法

slice() 方法创建一个新数组，其包含从开始到结束（不包括结束）选择的元素。当您使用 slice() 方法时，它返回的是新数组的浅表副本，这是一个与原始数组不同的数组，但它仍然引用相同的对象。

let arr = [1, 2, 3, 4, 5];
let newArr = arr.slice();

console.log('原数组:', arr); // 原数组: [1, 2, 3, 4, 5]
console.log('新数组:', newArr); // 新数组: [1, 2, 3, 4, 5]

// 修改原数组
arr[0] = 'a';
console.log('修改后的原数组:', arr); // 修改后的原数组: ["a", 2, 3, 4, 5]
console.log('新数组:', newArr); // 新数组: [1, 2, 3, 4, 5]

注意，我们改变了原始数组的第一个元素，但新数组未受到影响。

2. 使用 concat() 方法

concat() 方法用于连接两个或多个数组。它不会改变现有数组，而是返回一个新数组，其中包含来自原始数组的元素。

let arr = [1, 2, 3, 4, 5];
let newArr = arr.concat();

console.log('原数组:', arr); // 原数组: [1, 2, 3, 4, 5]
console.log('新数组:', newArr); // 新数组: [1, 2, 3, 4, 5]

// 修改原数组
arr[0] = 'a';
console.log('修改后的原数组:', arr); // 修改后的原数组: ["a", 2, 3, 4, 5]
console.log('新数组:', newArr); // 新数组: [1, 2, 3, 4, 5]

请注意，这些示例非常相似。唯一的区别是使用 concat() 方法而不是 slice() 方法。它的结果是具有相同的输出。我们同样可以看到新数组不受原始数组的影响。

3. 使用展开运算符

展开运算符是一个用于操作数组和对象的新功能，它允许我们轻松地将一个数组展开为另一个数组。使用 ... 操作符可以很容易地创建新数组的一个副本。

let arr = [1, 2, 3, 4, 5];
let newArr = [...arr];

console.log('原数组:', arr); // 原数组: [1, 2, 3, 4, 5]
console.log('新数组:', newArr); // 新数组: [1, 2, 3, 4, 5]

// 修改原数组
arr[0] = 'a';
console.log('修改后的原数组:', arr); // 修改后的原数组: ["a", 2, 3, 4, 5]
console.log('新数组:', newArr); // 新数组: [1, 2, 3, 4, 5]

这里我们使用 ... 操作符来展开原始数组。这将返回一个新数组，其中包含了原始数组的所有元素。由于运算符创建了一个新数组的副本，因此它不会影响原始数组。

总结

以上这些方法都可以用来复制 JavaScript 数组。如果您需要对数组进行操作，只需复制一个数组即可确保不会更改原始数组。所有这些方法，包括 slice()、concat() 和展开运算符，都返回一个新的浅表副本，确保这种行为。