记录--Object.assign 这算是深拷贝吗
这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助
在JavaScript中,Object.assign() 是一个用于合并对象属性的常见方法。然而,对于许多开发者来说,关于它是否执行深拷贝的认识可能存在一些混淆。先说答案Object.assign()
不属于深拷贝,我们接着往下看。
Object.assign() 概览
首先,让我们回顾一下 Object.assign()
的基本用法。该方法用于将一个或多个源对象的属性复制到目标对象,并返回目标对象。这一过程是浅拷贝的,即对于嵌套对象或数组,只是拷贝了引用而非创建新的对象。
1 2 3 4 5 6 7 | const obj = { a: 1, b: { c: 2 } }; const obj2 = { d: 3 }; const mergedObj = Object.assign({}, obj, obj2); console.log(mergedObj); // 输出: { a: 1, b: { c: 2 }, d: 3 } |
浅拷贝的陷阱
浅拷贝的特性意味着如果源对象中包含对象或数组,那么它们的引用将被复制到新的对象中。这可能导致问题,尤其是在修改新对象时,原始对象也会受到影响。
1 2 3 4 5 6 | const obj = { a: 1, b: { c: 2 } }; const clonedObj = Object.assign({}, obj); clonedObj.b.c = 3; console.log(obj); // { a: 1, b: { c: 3 } } console.log(clonedObj); // { a: 1, b: { c: 3 } } |
在这个例子中,修改 clonedObj
的属性也会影响到原始对象 obj
。
因此,如果我们需要创建一个全新且独立于原始对象的拷贝,我们就需要进行深拷贝。而 Object.assign() 并不提供深拷贝的功能。
深拷贝的需求
如果你需要进行深拷贝而不仅仅是浅拷贝,就需要使用其他的方法,如使用递归或第三方库来实现深度复制。以下是几种常见的深拷贝方法:
1. 使用 JSON 序列化和反序列化
1 2 3 4 5 6 | const obj = { a: 1, b: { c: 2 } }; const deepClonedObj = JSON.parse(JSON.stringify(obj)); deepClonedObj.b.c = 3; console.log(obj); // { a: 1, b: { c: 2 } } console.log(deepClonedObj); // { a: 1, b: { c: 3 } } |
这种方法利用了 JSON 的序列化和反序列化过程,通过将对象转换为字符串,然后再将字符串转换回对象,实现了一个全新的深拷贝对象。
需要注意的是,这种方法有一些限制,例如无法处理包含循环引用的对象,以及一些特殊对象(如 RegExp 对象)可能在序列化和反序列化过程中失去信息。
2. 使用递归实现深拷贝
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | function deepClone(obj) { if (obj === null || typeof obj !== 'object' ) { return obj; } const clonedObj = Array.isArray(obj) ? [] : {}; for ( let key in obj) { if (obj.hasOwnProperty(key)) { clonedObj[key] = deepClone(obj[key]); } } return clonedObj; } const obj = { a: 1, b: { c: 2 } }; const deepClonedObj = deepClone(obj); deepClonedObj.b.c = 3; console.log(obj); // { a: 1, b: { c: 2 } } console.log(deepClonedObj); // { a: 1, b: { c: 3 } } |
这是一个递归实现深拷贝的方法。它会递归地遍历对象的属性,并创建它们的副本。这种方法相对灵活,可以处理各种情况。
但需要注意在处理大型对象或深度嵌套的对象时可能会导致栈溢出。
3. 使用第三方库
许多第三方库提供了强大而灵活的深拷贝功能,其中最常用的是 lodash 库中的 _.cloneDeep
方法。
1 2 3 4 5 6 7 8 | const _ = require( 'lodash' ); const obj = { a: 1, b: { c: 2 } }; const deepClonedObj = _.cloneDeep(obj); deepClonedObj.b.c = 3; console.log(obj); // { a: 1, b: { c: 2 } } console.log(deepClonedObj); // { a: 1, b: { c: 3 } } |
使用第三方库的优势在于它们通常经过精心设计和测试,可以处理更多的边界情况,并提供更好的性能。
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 实操Deepseek接入个人知识库
· CSnakes vs Python.NET:高效嵌入与灵活互通的跨语言方案对比
· 【.NET】调用本地 Deepseek 模型
· Plotly.NET 一个为 .NET 打造的强大开源交互式图表库
· 上周热点回顾(2.17-2.23)