JS 浅拷贝的方法

JS 浅拷贝的方法有以下几种： 1. Object.assign()方法：将所有可枚举属性的值从一个或多个源对象复制到目标对象，并返回目标对象。 ``` let obj1 = { name: '张三', age: 20 }; let obj2 = Object.assign({}, obj1); console.log(obj2); // { name: '张三', age: 20 } ``` 2. 扩展运算符(...)：用于数组和对象的浅拷贝。 ``` let obj1 = { name: '张三', age: 20 }; let obj2 = {...obj1}; console.log(obj2); // { name: '张三', age: 20 } ``` 3. Array.prototype.slice()：用于数组的浅拷贝。 ``` let arr1 = [1, 2, 3]; let arr2 = arr1.slice(); console.log(arr2); // [1, 2, 3] ``` 4. Array.prototype.concat()：用于数组的浅拷贝。 ``` let arr1 = [1, 2, 3]; let arr2 = arr1.concat(); console.log(arr2); // [1, 2, 3] ```

JS浅拷贝方法

### JavaScript 中实现浅拷贝的方法在 JavaScript 中，可以通过多种方式实现浅拷贝。以下是几种常见的方式及其特点： #### 使用 `Object.assign()` 方法 `Object.assign()` 是一种简单且常用的方式来创建目标对象的浅拷贝[^1]。该方法会将源对象的所有可枚举属性复制到目标对象上。 ```javascript const source = { a: 1, b: { c: 2 } }; const shallowCopy = Object.assign({}, source); console.log(shallowCopy.a === source.a); // true (基本类型的值被直接复制) console.log(shallowCopy.b === source.b); // true (引用类型的值仍然指向同一内存地址) ``` #### 利用扩展运算符 (`...`) 扩展运算符也可以用于实现浅拷贝，其行为类似于 `Object.assign()` 的功能。 ```javascript const source = { a: 1, b: { c: 2 } }; const shallowCopy = { ...source }; console.log(shallowCopy.a === source.a); // true console.log(shallowCopy.b === source.b); // true ``` #### 手动循环赋值通过手动遍历对象的键并将它们逐一赋值给新对象，可以完成浅拷贝操作。这种方式需要特别注意避免拷贝原型链上的属性和方法[^4]。 ```javascript function shallowCopy(obj) { const copy = {}; for (let key in obj) { if (obj.hasOwnProperty(key)) { copy[key] = obj[key]; } } return copy; } const source = { a: 1, b: { c: 2 } }; const copiedObj = shallowCopy(source); console.log(copiedObj.a === source.a); // true console.log(copiedObj.b === source.b); // true ``` 以上三种方法均属于浅拷贝范畴，即只复制一层结构的内容。对于嵌套的对象或数组，这些方法并不会递归地复制内部的数据结构，而是继续共享相同的引用。 ---

js深拷贝和浅拷贝方法

在JavaScript中，深拷贝和浅拷贝是两种常用的对象拷贝方法。浅拷贝是按位拷贝对象，创建一个新对象，并将原始对象的属性值精确拷贝到新对象中。如果属性是基本类型，拷贝的就是基本类型的值；如果属性是内存地址（引用类型），拷贝的就是内存地址。因此，如果其中一个对象改变了这个地址，就会影响到另一个对象。\[3\] 深拷贝是将原始对象及其所有嵌套对象的属性值都进行拷贝，创建一个全新的对象。深拷贝会拷贝所有的属性，并拷贝属性指向的动态分配的内存。当对象和它所引用的对象一起拷贝时即发生深拷贝。深拷贝相比于浅拷贝速度较慢并且花销较大。\[2\] 在JavaScript中，实现深拷贝的方法有以下几种： 1. 通过递归的方式实现深拷贝，可以使用jQuery中的extend方法来实现。这种方法会递归地遍历对象的所有属性，并进行拷贝。\[1\] 2. 使用JSON.parse()和JSON.stringify()方法来实现深拷贝。首先将对象转换为JSON字符串，然后再将JSON字符串转换为新的对象。这种方法可以实现简单的深拷贝，但是对于包含函数、正则表达式等特殊类型的对象可能会出现问题。\[1\] 3. 使用第一种方法中的递归方式来实现深拷贝。这种方法需要自己编写递归函数来遍历对象的所有属性，并进行拷贝。\[1\] 总结起来，深拷贝是将原始对象及其所有嵌套对象的属性值都进行拷贝，创建一个全新的对象，而浅拷贝只是按位拷贝对象，创建一个新对象，并将原始对象的属性值精确拷贝到新对象中。在JavaScript中，可以通过递归方式、JSON.parse()和JSON.stringify()方法等来实现深拷贝。 #### 引用[.reference_title] - *1* [JavaScript深浅拷贝(三种方法)](https://blog.csdn.net/weixin_46022934/article/details/121415082)[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^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* *3* [js实现浅拷贝和深拷贝](https://blog.csdn.net/ab_er/article/details/126009166)[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^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

阅读全文

JS 浅拷贝的方法

JS浅拷贝方法

js深拷贝和浅拷贝方法

相关推荐

JS浅拷贝和深拷贝原理与实现方法分析

JS中实现浅拷贝和深拷贝的代码详解

javascript实现拷贝功能

JavaScript数组拷贝方法全解析：浅拷贝与深拷贝

JS浅拷贝与深拷贝实现方法解析

js 浅拷贝十种方法

javascript浅拷贝

JavaScript浅拷贝与深拷贝详解及其实现方法

js的浅拷贝和深拷贝方法

js 深拷贝和浅拷贝实现方法

javascript 浅拷贝深拷贝

js 浅拷贝 深拷贝

js浅拷贝实现

JS浅拷贝对象

js 浅拷贝 和深拷贝

js 浅拷贝和深拷贝

Js浅拷贝和深拷贝

javascript 深拷贝浅拷贝

大家在看

商品条形码及生产日期识别数据集

7.0 root.rar

RK3308开发资料

即时记截图精灵 v2.00.rar

WinUSB4NuVCOM_NUC970+NuWriter.rar

最新推荐

C#类库封装：简化SDK调用实现多功能集成，构建地磅无人值守系统

Teleport Pro教程：轻松复制网站内容

【跨平台开发者的必读】：解决Qt5Widgetsd.lib目标计算机类型冲突终极指南

普通RNN结构和特点

探讨通用数据连接池的核心机制与应用

【LabVIEW网络通讯终极指南】：7个技巧提升UDP性能和安全性

简要介绍cnn卷积神经网络

基于ASP的深度学习网站导航系统功能详解

【Oracle数据泵进阶技巧】：避免ORA-31634和ORA-31664错误的终极策略

多头注意力机制的时间复杂度

js 浅拷贝深拷贝

js 浅拷贝和深拷贝