工业设计作品志鸿优化设计官网

在JavaScript中，深拷贝和浅拷贝的主要区别在于它们处理对象属性的方式。

浅拷贝（Shallow Copy）只复制对象的引用，而不是实际的对象。因此，如果你修改了复制的对象，原始对象也会受到影响。

深拷贝（Deep Copy）则会创建一个新的对象，并复制原始对象的所有元素。这样，如果你修改了复制的对象，原始对象不会受到影响。

浅拷贝示例：

let obj1 = { a: 1, b: { c: 2 } };  
let obj2 = Object.assign({}, obj1);  console.log(obj1); // { a: 1, b: { c: 2 } }  
console.log(obj2); // { a: 1, b: { c: 2 } }  obj2.a = 2;  
console.log(obj1); // { a: 1, b: { c: 2 } }  
console.log(obj2); // { a: 2, b: { c: 2 } }  obj2.b.c = 3;  
console.log(obj1); // { a: 1, b: { c: 3 } }  
console.log(obj2); // { a: 2, b: { c: 3 } }

 在这个例子中，Object.assign({}, obj1) 创建了一个新对象 obj2，并将 obj1 的所有属性复制到 obj2。但是，当修改 obj2.b.c 时，obj1.b.c 也被修改了，因为 obj1 和 obj2 共享同一个 b 对象。

深拷贝示例：

let obj1 = { a: 1, b: { c: 2 } };  
let obj2 = JSON.parse(JSON.stringify(obj1));  console.log(obj1); // { a: 1, b: { c: 2 } }  
console.log(obj2); // { a: 1, b: { c: 2 } }  obj2.a = 2;  
console.log(obj1); // { a: 1, b: { c: 2 } }  
console.log(obj2); // { a: 2, b: { c: 2 } }  obj2.b.c = 3;  
console.log(obj1); // { a: 1, b: { c: 2 } }  
console.log(obj2); // { a: 2, b: { c: 3 } }

在这个例子中，JSON.parse(JSON.stringify(obj1)) 创建了一个新对象 obj2，并将 obj1 的所有属性复制到 obj2。然后，修改 obj2.b.c 并不会影响 obj1.b.c，因为 obj1 和 obj2 有不同的 b 对象。这是因为 JSON.stringify 方法将对象转换为 JSON 字符串，然后 JSON.parse 方法将 JSON 字符串转换回新对象。在这个过程中，所有的对象都会被转换为新的对象。