javascript数组复制详解

JavaScript 数组复制详解

在 JavaScript 中,数组是一种非常常见的数据类型。有时候我们需要将一个数组复制到另一个数组中,这就需要用到 JavaScript 数组复制操作。本文将详细讲解 JavaScript 数组复制的各种方法,包括浅复制和深复制,并提供相应的示例代码。

浅复制

浅复制是指将原数组的所有元素复制到新数组中,如果原数组中的元素是基本数据类型(如数字、字符串等),则直接复制值;如果原数组中的元素是引用数据类型(如对象、数组等),则复制引用。因此,在新数组中修改引用数据类型的元素时,会影响原数组中对应的元素。

方法一:使用 slice() 方法

slice() 方法可以返回一个新的数组对象,同时复制指定的起始索引到结束索引(不包括结束索引)之间的元素。如果没有指定参数,则复制整个数组。

----- ---- - --- -- ---
----- ---- - -------------
------------------ -- --- -- --

方法二:使用 concat() 方法

concat() 方法可以合并两个或多个数组,并返回一个新数组。如果参数是一个或多个数组,则复制这些数组中的元素。concat() 方法不改变现有数组,而是返回一个新数组。

----- ---- - --- -- ---
----- ---- - ----------------
------------------ -- --- -- --

方法三:使用展开运算符

ES6 新增了展开运算符(...),可以将一个数组展开为多个元素,从而方便地复制一个数组。

----- ---- - --- -- ---
----- ---- - ----------
------------------ -- --- -- --

深复制

深复制是指将原数组的所有元素复制到新数组中,包括引用数据类型的元素,同时新数组中的元素与原数组中的元素完全独立。因此,在新数组中修改引用数据类型的元素时,不会影响原数组中对应的元素。

方法一:使用 JSON.parse() 和 JSON.stringify() 方法

JSON.parse() 方法可以解析 JSON 字符串,并返回一个 JavaScript 对象或值。JSON.stringify() 方法可以将 JavaScript 值转换为 JSON 字符串。通过使用这两个方法,我们可以实现深复制。

----- ---- - ------- -------- ------ --------
----- ---- - ---------------------------------
------------ - ------
------------------ -- ------- -------- ------ -------
------------------ -- ------- ------- ------ -------

需要注意的是,JSON.stringify() 方法只能序列化对象的可枚举属性,不能序列化函数、Symbol 类型的值、undefined 和 NaN 等值。

方法二:使用递归复制

递归复制是指遍历原数组中的每个元素,如果是引用数据类型,则对其进行递归复制。由于 JavaScript 中的数组可以包含多种数据类型,因此需要对每种数据类型进行不同的处理。

-------- ------------- -
  -- ------- --- --- -------- -- --- --- ----- -
    ------ ----
  -
  --- -------
  -- -------------------- -
    ------ - ---
    --- ---- - - -- - - ----------- ---- -
      ------------------------------
    -
  - ---- -
    ------ - ---
    --- ---- --- -- ---- -
      -- ------------------------- -
        ----------- - -------------------
      -
    -
  -
  ------ -------
-

----- ---- - ------- -------- ------ --------
----- ---- - ------------

- ---------------------------------------------------------- --------
-------------------------------------------------------------------------------------