Javascript 浅拷贝/深度拷贝的区别?

在 JavaScript 中,浅拷贝和深拷贝都是用来复制对象的,但它们复制的深度不同。

浅拷贝(Shallow Copy): 浅拷贝只复制对象的顶层属性。如果对象的属性值是基本类型(如数字、字符串、布尔值),那么就直接复制这个值;如果属性值是引用类型(如对象、数组),那么复制的是这个值的引用,而不是实际的对象或数组。这就意味着,如果你修改了新对象的一个引用类型的属性,那么原对象的对应属性也会被修改。

let obj1 = { a: 1, b: [1, 2, 3] };
let obj2 = {...obj1};
obj2.b.push(4);
console.log(obj1.b); // 输出:[1, 2, 3, 4]

在这个例子中,我们使用了对象扩展运算符(…)来创建一个新的对象,这是一种浅拷贝的方式。当我们修改了新对象的 b 属性时,原对象的 b 属性也被修改了。

深拷贝(Deep Copy): 深拷贝不仅复制对象的顶层属性,还会递归地复制所有的子属性。无论属性值是基本类型还是引用类型,都会创建一个新的副本。这就意味着,新对象和原对象完全独立,修改其中一个不会影响另一个。

let obj1 = { a: 1, b: [1, 2, 3] };
let obj2 = JSON.parse(JSON.stringify(obj1));
obj2.b.push(4);
console.log(obj1.b); // 输出:[1, 2, 3]

在这个例子中,我们使用了 JSON.stringifyJSON.parse 方法来创建一个新的对象,这是一种深拷贝的方式。当我们修改了新对象的 b 属性时,原对象的 b 属性没有被修改。

需要注意的是,使用 JSON.stringifyJSON.parse 方法进行深拷贝有一些限制,比如无法复制函数和循环引用的对象等。在实际开发中,我们通常会使用一些库(如 lodash)的深拷贝函数,因为这些函数已经处理了各种边缘情况。

发表评论

后才能评论