在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 字符串转换回新对象。在这个过程中,所有的对象都会被转换为新的对象。