前端中什么是深拷贝什么是浅拷贝,以及深拷贝和浅拷贝的区别
时间: 2024-04-16 07:15:42 浏览: 240
深拷贝和浅拷贝都是对于复杂数据类型而言的。对于浅拷贝(Shallow Copy),它仅仅会拷贝对象的引用,而不会拷贝对象本身。对于深拷贝(Deep Copy),它会拷贝对象本身以及对象内部所有引用的对象。
举例来说,如果有一个对象A,它的某个属性是另一个对象B。那么进行浅拷贝时,仅仅会将A中B的引用复制给新的对象,而进行深拷贝时,不仅仅会复制B的引用,还会复制B本身。
实现深拷贝的方式有很多,比如递归遍历对象等方式,而浅拷贝可以通过一些对象方法实现,比如 Object.assign()。
总的来说,浅拷贝只是将对象的引用复制给了新的对象,而深拷贝则是复制了整个对象及其引用的对象。
相关问题
前端深拷贝与浅拷贝的区别
前端深拷贝与浅拷贝的区别在于复制对象时是否递归地复制对象中的子对象。
浅拷贝是创建一个新对象,这个对象有着原始对象属性值的一份精确拷贝。如果属性是基本类型,拷贝的就是基本类型的值;如果属性是引用类型,拷贝的就是内存地址。所以如果其中一个对象改变了这个地址,就会影响到另一个对象。浅拷贝只复制一层对象的属性。
深拷贝是将一个对象从内存中完整地拷贝一份出来,从堆内存中开辟一个新的区域存放新对象,并递归地拷贝对象中的子对象。深拷贝后的新对象与原对象互不影响,即使修改新对象的值也不会影响原对象。深拷贝复制了所有层级的对象属性。
在前端开发中,深拷贝通常用于确保修改副本对象不会影响原始对象,尤其是在涉及到多层嵌套的对象或数组时。常见的实现深拷贝的方式包括使用递归、JSON.stringify和JSON.parse等方法。而浅拷贝则可以通过赋值操作、Object.assign等方法来实现。
因此,深拷贝与浅拷贝的区别在于复制对象时是否递归地复制对象中的子对象,以及复制后的对象是否与原对象互不影响。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* [[前端面试题]:深拷贝与浅拷贝的区别](https://blog.csdn.net/WWEIZAI/article/details/126519334)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
- *3* [前端面试:浅拷贝和深拷贝的区别?](https://blog.csdn.net/weixin_39570751/article/details/123363926)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]
前端 深拷贝和浅拷贝
前端中的深拷贝和浅拷贝是用于复制对象或数组的概念。
浅拷贝是指创建一个新的对象或数组,然后将原始对象或数组的引用复制给新对象或数组。这意味着当你修改新对象或数组时,原始对象或数组也会被修改。实现浅拷贝的方法有多种,如使用 `Object.assign()`、扩展运算符 `...` 或者 `Array.prototype.slice()` 等。
例如,使用扩展运算符进行浅拷贝:
```javascript
const originalObj = { a: 1, b: { c: 2 } };
const shallowCopy = { ...originalObj };
shallowCopy.a = 3;
shallowCopy.b.c = 4;
console.log(originalObj); // { a: 1, b: { c: 4 } }
console.log(shallowCopy); // { a: 3, b: { c: 4 } }
```
深拷贝则是在创建新对象或数组时,递归地复制原始对象或数组中的所有值,从而创建一个完全独立的副本。这意味着修改新对象或数组不会影响原始对象或数组。常见的实现深拷贝的方法有使用递归、`JSON.parse(JSON.stringify())` 或者第三方库如 `lodash` 的 `cloneDeep()`。
例如,使用`JSON.parse(JSON.stringify())`进行深拷贝:
```javascript
const originalObj = { a: 1, b: { c: 2 } };
const deepCopy = JSON.parse(JSON.stringify(originalObj));
deepCopy.a = 3;
deepCopy.b.c = 4;
console.log(originalObj); // { a: 1, b: { c: 2 } }
console.log(deepCopy); // { a: 3, b: { c: 4 } }
```
需要注意的是,使用 `JSON.parse(JSON.stringify())` 的方式存在一些限制,例如无法复制函数、循环引用等。在实际应用中,需要根据需求选择合适的方法进行拷贝。
阅读全文