js 深浅拷贝的区别和实现方法

一：什么浅拷贝：

浅拷贝创建一个新对象，然后将原始对象的所有属性值复制到新对象中。这意味着，如果原始对象的属性值是基本类型（例如数字、字符串），那么这些值会被直接复制到新对象中。但如果属性值是引用类型（例如对象或数组），则新对象中的属性仍然引用原始对象中相同的引用。有一个原始对象如下

let originObj= {
	a: 1,
	b: 2,
	c: {
		d: 4
	}
}

浅拷贝代码如下：

let result = {};
for(let key in originObj){
	result[key] = originObj[key]
} 

这样就实现了一个浅拷贝，此时 result 和 originObj 没有指向同一个对象，但是 result.c 和 originObj.c 是指向的同一个对象。
同样能达到浅拷贝常见的还有扩展运算符、Object.assign等方法，如下：

let result1 = {...originObj};
let result2 = Object.assign({},originObj)

二：什么是深拷贝

深拷贝创建一个新对象，并递归地复制原始对象的所有层级，包括嵌套的对象和数组。这意味着新对象和原始对象是完全独立的，对新对象的修改不会影响原始对象，反之亦然。

如果对象里面不存在正则表达式、函数等特殊值，可以直接使用 JSON.parse(JSON.stringify(obj)) 方法，直接转成JSON字符串再转换回来，就可以实现深拷贝。
也可以通过一些第三方的库实现，比如lodash的cloneDeep方法。
当然也可以自己写一个深拷贝的方法，这里提供一个比较简单的方法

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

  if (hash.has(obj)) {
    return hash.get(obj);
  }

  const cloneObj = Array.isArray(obj) ? [] : {};

  hash.set(obj, cloneObj);

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

  return cloneObj;
}

三：总结

• 浅拷贝： 只复制对象的一层，对于引用类型的属性，复制的是引用而不是值。修改拷贝后的对象可能会影响原始对象。

• 深拷贝： 复制对象的所有层级，包括嵌套对象和数组。新对象和原始对象是完全独立的，修改一个不会影响另一个。

在实际应用中，选择深拷贝还是浅拷贝取决于具体的需求。深拷贝可能涉及到性能开销，特别是在处理大型对象或对象包含循环引用的情况下。因此，在选择拷贝方式时，需要根据项目的需求和性能考虑做出合适的选择。