当前位置: 首页 > 后端技术 > Node.js

JavaScript:使用递归实现对象深拷贝

时间:2023-04-03 15:59:24 Node.js

首先普及一下深拷贝和浅拷贝的区别。浅拷贝:是简单拷贝,用等号就可以完成leta={a:1}letb=a这样就完成了浅拷贝但是在修改objectb的时候,我们发现object的值a也改成了b.a=10console.log(a.a)=>10这是因为浅拷贝只复制指向对象的指针,新旧对象共享同一块内存。将同时修改另一个。深拷贝:与浅拷贝最简单明了的区别就是在不改变源对象的情况下修改被拷贝的对象。object.assign可以用来实现只有一层的对象的深拷贝,如下:leta={a:1,b:2,c:3}letb=Object.assign({},a)b.b=100console.log(a.b)=>2可以看出只用一层就可以做到对象实现深拷贝,但是如果对象中的元素还是对象,就不行了leta={a:1,b:2,c:3,d:{a:1}}letb=Object.assign({},a)b.d.a=100console.log(a.d.a)=>100对于这种比较复杂的对象,我们可以使用递归方式实现真实对象深拷贝函数deepClone(sourceObj,targetObj){letcloneObj=targetObj||{}if(!sourceObj||typeofsourceObj!=="object"||sourceObj.length===undefined){returnsourceObj}if(sourceObjinstanceofArray){cloneObj=sourceObj.concat()}else{for(letiinsourceObj){if(typeofsourceObj[i]==='object'){cloneObj[i]=deepClone(sourceObj[i],{})}else{cloneObj[i]=sourceObj[i]}}}returncloneObj}简单的几行代码就可以轻松实现对象的深拷贝。简单的测试代码如下:letsourceObj={a:1,b:{a:1},c:{a:1,b:{a:1}},d:function(){console.log('helloworld')},e:[1,2,3]}lettargetObj=deepClone(sourceObj,{})targetObj.c.b.a=9console.log(sourceObj)=>{a:1,b:{a:1},c:{a:1,b:{a:1}},d:[函数:d],e:[1,2,3]}console.log(targetObj)=>{a:1,b:{a:1},c:{a:1,b:{a:9}},d:[Function:d],e:[1,2,3]}另外,深拷贝的两个库**jquery**介绍:lettargetObj=$.extent(true,{},sourceObj)**lodash函数库**使用方法:npminstalllodash**es5写法**letlodash=require('lodash')**es6写**importlodashfrom'lodash'lettargetOj=lodash.cloneDeep(sourceObj)如果你觉得有什么不对的地方,请给我你的建议。