JavaScript中深拷贝和浅拷贝的区别

在 JavaScript 中，对象和数组是引用类型，当对它们进行赋值或传参时，只是复制了一个引用，指向同一个对象或数组

深拷贝
如果我们想要完整地复制一个对象或数组，而不是仅仅复制引用，就需要使用深拷贝（deep copy）。

以下是几种实现深拷贝的方式：

1. 递归拷贝
function deepCopy(obj) {
  // 判断是否为对象或数组
  if (typeof obj !== 'object' || obj === null) {
    return obj;
  }
  // 判断是对象还是数组
  const newObj = Array.isArray(obj) ? [] : {};
  // 遍历对象或数组的属性，递归调用深拷贝函数
  for (let key in obj) {
    newObj[key] = deepCopy(obj[key]);
  }
  return newObj;
}
2. JSON 序列化/反序列化
function deepCopy(obj) {
  return JSON.parse(JSON.stringify(obj));
}
⚠️ 这种方式的缺点是无法拷贝函数和循环引用的对象，同时对于 undefined 和 Symbol 类型的值也会丢失。

3. lodash 库中的 _.cloneDeep 方法
const _ = require('lodash');
const newObj = _.cloneDeep(obj);
⚠️ 这是一种比较方便的深拷贝方式，不过需要引入 lodash 库。

浅拷贝
如果我们想要创建一个与原对象或数组相似，但不共享引用的对象或数组，就需要使用浅拷贝（shallow copy）。

以下是几种实现浅拷贝的方式：

1. Object.assign() 方法
const obj1 = { a: 1, b: 2 };
const obj2 = Object.assign({}, obj1);
console.log(obj2); // { a: 1, b: 2 }
2. 扩展运算符（spread operator）
const arr1 = [1, 2, 3];
const arr2 = [...arr1];
console.log(arr2); // [1, 2, 3]
3. Array.slice() 方法
const arr1 = [1, 2, 3];
const arr2 = arr1.slice();
console.log(arr2); // [1, 2, 3]
⚠️ 需要注意的是，这些方法只能实现浅拷贝，如果原对象或数组中包含了嵌套的对象或数组，则仍然是共享引用的。如果需要实现深拷贝，则需要使用其他方法。