JS复制数组|极客笔记

JS复制数组

在JavaScript中，复制数组是一个常见的操作，它可以在很多情况下帮助我们更方便地处理数据。在本文中，我将详细介绍如何在JavaScript中复制数组，包括浅复制和深复制。

什么是浅复制和深复制

在了解如何复制数组之前，首先需要明确什么是浅复制和深复制。

浅复制：浅复制是将一个数组的值复制给另一个数组，这样两个数组虽然是独立的，但是它们内部的元素引用的是相同的对象。当其中一个数组修改对象的属性时，另一个数组中对应的对象的属性也会随之改变。这是因为复制的只是对象的引用，而不是对象本身。
深复制：深复制是在复制数组的同时，还会复制数组内部的所有对象。这样生成的新数组和原数组是完全独立的，对其中一个数组进行修改不会影响另一个数组。

接下来，让我们详细讨论如何在JavaScript中实现浅复制和深复制。

浅复制数组

在JavaScript中，可以使用多种方法进行浅复制数组。下面介绍了几种常用的方法：

利用ES6的展开运算符

const originalArray = [1, 2, 3, 4, 5];
const copiedArray = [...originalArray];

console.log(copiedArray); // [1, 2, 3, 4, 5]

使用slice()方法

const originalArray = [1, 2, 3, 4, 5];
const copiedArray = originalArray.slice();

console.log(copiedArray); // [1, 2, 3, 4, 5]

使用concat()方法

const originalArray = [1, 2, 3, 4, 5];
const copiedArray = originalArray.concat();

console.log(copiedArray); // [1, 2, 3, 4, 5]

上述方法都可以实现浅复制数组，但需要注意的是，如果数组中包含对象或数组等引用类型的元素，这些方法并不能实现深复制。

深复制数组

实现深复制数组相对复杂一些，我们需要遍历数组中的每一个元素，对其中的对象进行复制。下面介绍一种递归实现深复制数组的方法：

function deepClone(arr) {
  let cloneArr = [];
  arr.forEach(item => {
    if (Array.isArray(item)) {
      cloneArr.push(deepClone(item));
    } else if (typeof item === 'object') {
      cloneArr.push(Object.assign({}, item));
    } else {
      cloneArr.push(item);
    }
  });
  return cloneArr;
}

const originalArray = [1, [2, 3], {a: 4, b: 5}];
const copiedArray = deepClone(originalArray);

console.log(copiedArray); // [1, [2, 3], {a: 4, b: 5}]

在上面的示例中，我们定义了一个deepClone()函数，递归地复制了数组中的所有元素。这样就可以实现深复制数组了。