浅拷贝Object.assign()

时间: 2023-10-12 20:04:06 浏览: 92

JavaScript 复制对象与Object.assign方法无法实现深复制

5星 · 资源好评率100%

### JavaScript 数据类型概述在JavaScript语言中，数据类型分为基本数据类型和复杂数据类型（也称为引用数据类型）。基本数据类型包括Number、Boolean、String、Null、Undefined和Symbol（ES6新增）。而复杂数据类型主要是Object，包括Array（数组）、Date（日期）、RegExp（正则表达式）、Function（函数）以及各种基本包装类型（如Boolean、String、Number等）。 ### 复杂数据类型的复制原理当我们复制一个复杂数据类型的变量时，实际上复制的是对象的引用（即指针），而不是对象本身。这意味着，如果有两个变量指向同一个对象，那么对其中一个变量所做的修改将会影响到另一个变量指向的对象。例如： ```javascript let obj = { character: 'peaceful' }; let copy = obj; obj.character = 'lovely'; console.log(copy.character); // 输出 'lovely' ``` ### 浅复制和深复制的区别浅复制（Shallow Copy）仅复制对象的第一层属性，如果属性值包含引用类型，则这些引用类型的内容不会被复制，仅仅是复制了指向原始数据的指针。而深复制（Deep Copy）则会递归复制所有的层，并且不复制指向原始数据的指针，而是复制实际的数据。 ### Object.assign方法的浅复制机制在ES6中，Object新增了一个assign方法，该方法可以实现对象的浅复制。其用法如下： ```javascript Object.assign(target, [source1, source2, source3...]) ``` 第一个参数`target`是目标对象，后面可以跟一个或多个源对象`source`。方法会将源对象的可枚举属性复制到目标对象中，如果目标对象和源对象拥有相同的属性，源对象的属性值会覆盖目标对象的属性值。需要注意的是，复制时仅包含对对象的引用，不包括嵌套对象的复制，因此它只实现了浅复制。例如，复制对象进行浅复制的操作如下： ```javascript let target = { a: 123 }; let source1 = { b: 456 }; let source2 = { c: 789 }; let obj = Object.assign(target, source1, source2); console.log(obj); // 输出 { a: 123, b: 456, c: 789 } ``` ### 如何实现深复制由于`Object.assign`方法无法实现深复制，我们需要使用其他方法来完成。常见的深复制实现手段包括使用递归函数手动复制每个属性，或者利用一些现代JavaScript库提供的深复制方法，例如Lodash的`_.cloneDeep`。递归函数实现深复制的示例代码： ```javascript function deepClone(obj) { if (obj === null || typeof obj !== 'object') { return obj; } let cloneObj = Array.isArray(obj) ? [] : {}; for (let key in obj) { if (obj.hasOwnProperty(key)) { cloneObj[key] = deepClone(obj[key]); } } return cloneObj; } let originalObj = { a: 1, b: { c: 2 } }; let clonedObj = deepClone(originalObj); console.log(clonedObj); // 输出 { a: 1, b: { c: 2 } } ``` ### 结论在JavaScript中，由于复杂数据类型的复制涉及到对象引用，直接复制变量时需要注意是否希望复制引用还是复制实际的对象。浅复制只复制对象的顶层属性，而不涉及嵌套对象，而深复制则会递归复制所有的嵌套对象，实现真正意义上的对象复制。对于无法实现深复制的`Object.assign`方法，开发者可以采用手动递归复制的方式或者依赖第三方库来完成深复制的需求。

浅拷贝是指通过Object.assign()方法创建的新对象与原对象共用同一块内存地址，因此当原对象的属性值发生改变时，新对象的对应属性值也会受到影响。这种情况适用于属性值为简单类型（如字符串、数字）的情况。123 #### 引用[.reference_title] - *1* *2* *3* [ES6之Object.assign()用法，Object.assign()到底是浅拷贝还是深拷贝？](https://blog.csdn.net/ZiChen_Jiang/article/details/121858927)[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^v92^chatsearchT0_1"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]

阅读全文

浅拷贝Object.assign()

相关推荐

深入理解JavaScript的Object.assign方法

掌握JavaScript Object.assign()静态方法

JavaScript对象拷贝与Object.assign用法实例分析

Object.assign浅拷贝

object.assign是深拷贝还是浅拷贝

Object.assign()浅拷贝还是深拷贝

Object.assign()和浅拷贝的区别

object.assign和扩展运算法是深拷贝还是浅拷贝，两者区别

Object.assign深拷贝？

object.assign是什么拷贝

object.assign

Object.assign

Object.Assign

使用 Object.assign({}, obj) 可以实现对象的浅拷贝

Object 方法 详细 Object.assign

详解Object.assign

深入了解JavaScript中的Object.assign用法

深度解析Object.assign()的JavaScript实现与应用

Font Awesome图标字体库提供可缩放矢量图标,它可以被定制大小、颜色、阴影以及任何可以用CSS的样式

最新推荐

JavaScript对象拷贝与Object.assign用法实例分析

正整数数组验证库：确保值符合正整数规则

管理建模和仿真的文件

【损失函数与随机梯度下降】：探索学习率对损失函数的影响，实现高效模型训练

在ADS软件中，如何选择并优化低噪声放大器的直流工作点以实现最佳性能？

系统移植工具集：镜像、工具链及其他必备软件包

"互动学习：行动中的多样性与论文攻读经历"

【损失函数与批量梯度下降】：分析批量大小对损失函数影响，优化模型学习路径

在设计高性能模拟电路时，如何根据应用需求选择合适的运算放大器，并评估供电对电路性能的影响？

掌握JavaScript加密技术：客户端加密核心要点

Object 方法详细 Object.assign