如何在 JavaScript 中克隆数组？

引言

JavaScript 是 Web 开发的语言之一。它可以执行许多操作。此外，还有许多用于排序、滚动、选择、切片和查找以处理整个数组的方法。在本文中，我们将通过执行来检查每种方法，并且我们还将学习如何复制数组。

我们需要创建一个与主数组或原始数组相同的新数组，其中包含相同的数字，以便在 JavaScript 中更改数组。

有许多方法可以克隆 JavaScript 中的数组。我们将使用下面提供的方法检查克隆数组的每种方法

Array.slice()

Array.slice 是一种方法，可以从原始数组中删除特定的条目或数字。当我们不需要某些数字时，可以使用此方法。我们需要首先拆分数组并复制一组，通过选择开始和结束点。

以下代码显示了如何切片和 Array。

代码

输出

如果 slice() 方法在没有参数的情况下调用，它将从特定索引开始复制原始数组到末尾。切片数组就是 mainArray 的一个副本。在上面的情况下，slice() 函数基于数字（1,2）返回“[2]”。数字范围从 0 到 2。

重要的是要注意，当我们使用 slice() 方法处理多个数组时，将分配引用而不是值。

Array.concat()

此方法将通过添加、合并或连接多个数组为我们提供一个新数组。

让我们在下面讨论这种连接方法

代码

输出

Array.map

Array.map() 方法将为我们提供一个输出，该输出也是一个数组，其大小与输入数组相同。Map() 为数组中的每个项生成一个新数组。Map() 函数在内部为空时不起作用。Map 函数不会更改原始数组。

代码

输出

此程序使用 Array.map 方法创建数组的副本。map() 函数在数组的每个元素上执行指定的函数，并将结果返回到一个新数组中。

Array.filter

Array.filter() 函数，类似于 map()，输出一个数组，但结果数组的大小可能不总是相同的。Filter() 检查一个函数和一个条件，并在满足条件时返回该元素。

代码

输出

上面提到的程序通过使用 Array.filter 方法创建数组的副本。filter() 函数评估 nums 列表中的条件。如果满足要求，数字将被放入一个名为 numsClone 的新数组中。

Array.reduce

Array.reduce() 遍历数组的每个元素，并产生一个代表函数最终结果的单个值或对象。

语法

代码

输出

在提到的程序中，reduce 函数用于减少程序中数字的数量。在这种情况下，我们从一个空的 normalArray 开始，然后我们逐步包含 "num" 数组中的每个元素。必须返回该数组才能在下次迭代中使用该方法。返回数组 numClone 的引用。数字数组将被复制到 numClone 数组中。

JSON.stringify 和 JSON.parse

JSON.stringify 将对象转换为字符串，JSON.parse 将字符串转换为对象。当您结合这些内容时，您可以将某物转换为字符串，然后将其转换回一种新的信息类型。

JSON.parse() 和 JSON.stringify() 用于多级深度复制。它们复制任何级别的每个值而不是引用，并处理多维数组。

代码

输出

上面的程序使用 JSON.stringify 将 Array1 转换为字符串。使用 JSON.parse 将字符串转换为名为 Array2 的多维数组。此方法返回数组元素的副本而不是引用。输出显示更改 Array2 不会影响 Array1。

注意：您可以使用此方法安全地复制深度嵌套的数组。

结论

1. 有许多复制或克隆数组的方法，例如循环、扩展运算符 (...) 以及 slice、filter、reduce 和 map 等数组方法。
2. 在深度复制期间，会复制数组的引用。
3. parse 和 JSON.stringify 用于复制不同级别的数组。它们处理多维数组并复制值而不是引用。