js对象的深拷贝和浅拷贝

浅拷贝:只是复制指向某个对象的指针,而不复制对象本身新旧对象,它们还是共享同一内存。
深拷贝:会另选创造一个一模一样的对象,新对象和原对象不共享内存,修改新对象不会改到原对象。也就是老死不相往来了
知道了深浅拷贝的含义,那就来总结如何实现深浅拷贝。

let data={
			name:'ddd',
			type:'es',
			impl:[
				{
					e:1,a:2
				},
				{
					e:2,
					a:3
				}
			]
		}
		//第一种情况:
		let obj=data;			//浅拷贝
		obj.name='aa'			//修改name的值 data的name值也发生改变
		console.log(obj,data);
		//第二种情况:
		let obj1={data};			//定义obj1是一个对象,并且将data是obj1的子对象。
		obj1.name='bb'			//给obj1添加name属性,data的name值不发生改变
		obj1.data.impl[0].e=4;
		obj1.data.name='pp';
		console.log(obj1,data);
		//第三种情况:
		let obj2={...data};		//对象obj2拷贝data的值,如果属性第一层不是对象则是深拷贝。
		obj2.name='cc';
		obj2.impl[0].e=3
		console.log(obj2,data);

以上的代码是我无聊的时候瞎写的代码,但是我发现打印出来的值都是不一样的。有些知识点还是值得去总结的。
浅拷贝:
如上第一种情况就是一个浅拷贝的过程,obj和data共用一个内存地址,所以谁变谁都会变,这样很危险哦。
第二种情况虽然data是obj1的子对象,但是子对象和父对象也是浅拷贝的关系。
第三种情况也是浅复制,只能解决对象一层属性的所有复制。即属性不是对象,则修改它变成一个新的值则原对象不会发生改变。
对于第三种这个情况:有时候是深拷贝,有时候是浅拷贝 这样的语法在js很常见。只有当属性值不是对象的时候则是深拷贝否则就是浅拷贝
1、for in 遍历循环拷贝;
2、es6 Object.assign({ },obj);
3、{… obj};
4、concat;
5、slice
那么如何才能实现真正的拷贝呢?也就是真的老死不相往来了,一点关系也没有了呢?
1、利用JSON对象的parse和stringfy
JSON.stringfy是将一个js对象值转成一个JSON字符串;JSON.parse是将一个JSON字符串转成一个js对象。先转成字符串再转对象,所生成的对象和原来的对象不共用同一内存,实现深拷贝的过程。但是有个问题:undefined、function、symbol在转化中会被忽略。
2、利用递归函数来实现

function deepClone(source){
				const targetObj =source.constructor===Array?[]:{};
				for(let keys in source){
					if(source.hasOwnProperty(keys)){		//判断是否是非继承属性
						if(source[keys] && typeof source[keys]==='object'){
							targetObj[keys]=source[keys].constructor ===Array?[]:{};
							targetObj[keys]=deepClone(source[keys])
						}else{
							targetObj[keys]=source[keys]
						}
					}
				}
				return targetObj;
			}

3、loadsh第三方库来实现 _.cloneDeep

		var obj={
				a:{
					b:2,
					c:3
				}
			}
			var obj1=_.cloneDeep(obj);
			obj1.a.c=6;
			console.log(obj1,obj);
  • 2
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值