javascript中实现深拷贝的4种方法

什么是深拷贝 ?

在内存中重新开辟一个存储空间，完全克隆一个一模一样的对象。 深拷贝是一种复制对象的方式，通过递归地复制对象及其所有嵌套属性和子属性，从而在新的对象中创建一个完全独立的副本。 这意味着原始对象和深拷贝后的对象之间没有任何共享引用，修改一个对象不会影响另一个对象

浅拷贝则不然，它只复制对象的一级属性，而不会递归地复制下级嵌套属性,因此属性中仍存在原始对象属性中的引用，修改一个对象会影响到另一个对象

下面介绍几种实现深拷贝的方法：

1. 函数递归

function deepClone(obj) {
  if (obj === null || typeof obj !== 'object') {
    return obj;
  }

  let clone = Array.isArray(obj) ? [] : {};

  for (let key in obj) {
    if (obj.hasOwnProperty(key)) {
      clone[key] = deepClone(obj[key]);
    }
  }

  return clone;
}

2. 使用JSON.stringify() 和 JSON.parse()

const jsonStr = JSON.stringify(myobj);
const clonedObj = JSON.parse(jsonStr);

这种方式也可以实现深拷贝，但不推荐使用，因为有坑。 当对象内容项为Date,RegExp,function,undefined,null,error的时候，这种方法会出错，另外还会丢失部分引用

const myobj = {
  date: new Date(),
  regex: /pattern/,
  func: function() { console.log('Function') }
};
const jsonStr = JSON.stringify(myobj);
const clonedObj = JSON.parse(jsonStr);

console.log(clonedObj.date);  // 输出：字符串，而不是 Date 对象
console.log(clonedObj.regex); // 输出：空对象，而不是 RegExp 对象
console.log(clonedObj.func);  // 输出：undefined，函数丢失

const myobj = {
  a: 1
};
myobj.b = myobj;

const jsonStr = JSON.stringify(myobj);
const clonedObj = JSON.parse(jsonStr);  // 会抛出错误

3. 使用Lodash库中的cloneDeep()方法进行深拷贝

const clonedObj = _.cloneDeep(myObj);

4. 使用jquery的extend()方法进行深拷贝

let myObj =  {
  a: 1,
  b: {
    c: 2,
    d: {
      e: "hello"
    }
  }
};

let newObj = $.extend(true, {}, myObj);