js中的浅拷贝和深拷贝

浅拷贝Shallow Copy

浅拷贝只复制对象的顶层属性及其引用，而不复制这些引用所指向的对象。如果原始对象中的某个属性是一个对象或数组，那么浅拷贝后的对象将包含对这个内部对象或数组的引用，而不是这个对象或数组的一个新副本。

let obj1 = {  
    a: 1,  
    b: {  
        c: 2  
    }  
};  
  
// 使用扩展运算符（...）进行浅拷贝  
let obj2 = { ...obj1 };  
  
// 或者使用 Object.assign() 方法进行浅拷贝  
// let obj2 = Object.assign({}, obj1);  
  
console.log(obj2); // { a: 1, b: { c: 2 } }  
  
// 修改 obj2 的顶层属性 a  
obj2.a = 2;  
console.log(obj1.a); // 1，obj1 的 a 属性没有被修改  
  
// 修改 obj2 的 b 属性（这是一个对象的引用）  
obj2.b.c = 3;  
console.log(obj1.b.c); // 3，obj1 的 b.c 属性也被修改了，因为 obj1 和 obj2 的 b 属性指向同一个对象

深拷贝

深拷贝会复制对象及其所有子对象，直到最底层的基本数据类型。这意味着深拷贝后的对象与原始对象是完全独立的，修改其中一个对象不会影响另一个对象。

let obj1 = {  
    a: 1,  
    b: {  
        c: 2  
    }  
};  
  
// 使用 JSON 方法进行深拷贝（注意：这种方法有局限性）  
let obj2 = JSON.parse(JSON.stringify(obj1));  
  
// 或者使用 lodash 的 _.cloneDeep() 方法进行深拷贝  
// let _ = require('lodash');  
// let obj2 = _.cloneDeep(obj1);  
  
console.log(obj2); // { a: 1, b: { c: 2 } }  
  
// 修改 obj2 的顶层属性 a  
obj2.a = 2;  
console.log(obj1.a); // 1，obj1 的 a 属性没有被修改  
  
// 修改 obj2 的 b 属性（虽然它们看起来相同，但实际上是两个独立的对象）  
obj2.b.c = 3;  
console.log(obj1.b.c); // 2，obj1 的 b.c 属性没有被修改，因为 obj1 和 obj2 的 b 属性指向不同的对象

总结

浅拷贝就是复制对象的顶层属性即第一层属性，而深拷贝是复制对象的所有属性。所以浅拷贝修改第二层及以后属性时，也还是会影响原对象。深拷贝完全不被影响。

使用浅拷贝

// 使用扩展运算符（...）进行浅拷贝  
let obj2 = { ...obj1 };  
  
// 或者使用 Object.assign() 方法进行浅拷贝  
let obj2 = Object.assign({}, obj1);  

使用深拷贝

// 使用 JSON 方法进行深拷贝（注意：这种方法有局限性）  
let obj2 = JSON.parse(JSON.stringify(obj1));  
  
// 或者使用 lodash 的 _.cloneDeep() 方法进行深拷贝  
let _ = require('lodash');  
let obj2 = _.cloneDeep(obj1);