JS深拷贝数组 - Javascript

在 Javascript 开发中，我们通常需要多次使用数组的拷贝赋值，但是普通的拷贝方式存在一定的限制，无法实现对多层嵌套数组的拷贝。因此，本文将介绍 Javascript 中实现深拷贝数组的方法，以解决这一问题。

什么是深拷贝？

在 Javascript 中，数组和对象的赋值属于引用赋值。简单来说，就是在赋值时不会对原数组或对象进行拷贝，而是将其指向同一块内存地址。

普通的数组拷贝方式，例如使用 slice 方法或展开操作符 ...，只能拷贝一层的数组数据。而深拷贝则可以完全复制整个嵌套数组。

实现深拷贝的方法

1. JSON.parse(JSON.stringify())

目前最常用的实现深拷贝的方式是通过 JSON.parse(JSON.stringify(arr))，这种方式可以深度遍历整个数组，并通过对 JSON 对象的序列化和反序列化，实现复制整个嵌套数组。但需要注意的是，这种方式无法拷贝函数、正则、循环引用等类型的数据。

let arr = [1, 2, [3, 4], {name: 'John'}];
let cloneArr = JSON.parse(JSON.stringify(arr));
console.log(cloneArr); // [1, 2, [3, 4], {name: 'John'}]

2. 递归遍历拷贝

除了 JSON.parse(JSON.stringify()) 的方式外，我们还可以通过递归遍历的方式，实现数组的深拷贝。这里我们可以使用 Array.isArray() 方法判断当前元素是否为数组，是则递归遍历子数组，否则直接复制该元素。

function deepClone(arr) {
  let cloneArr = [];
  arr.forEach((element) => {
    if (Array.isArray(element)) {
      cloneArr.push(deepClone(element));
    } else {
      cloneArr.push(element);
    }
  });
  return cloneArr;
}

let arr = [1, 2, [3, 4], {name: 'John'}];
let cloneArr = deepClone(arr);
console.log(cloneArr); // [1, 2, [3, 4], {name: 'John'}]

需要注意的是，该方式无法拷贝函数、正则、循环引用等类型的数据。

总结

本文介绍了 Javascript 中实现深拷贝数组的两种方法，分别是 JSON.parse(JSON.stringify()) 和递归方式遍历。需要注意的是，这两种方式都无法处理函数、正则、循环引用等类型的数据。根据实际场景选择合适的方式，可以提高代码的可读性和可维护性。