js深拷贝浅拷贝区别及实现

区别：浅拷贝只能拷贝一层副本，对于对象中的子对象拷贝的是引用。而深拷贝能拷贝深层，实现完全独立。

	function simpleClone(initalObj) {
		var obj = {};
		for ( var i in initalObj) {
			obj[i] = initalObj[i];
		}
		return obj;
	}
	
	function deepClone(obj){
		let newObj = obj instanceof Array?[]:{};
		for(let index in obj){
			let tmp = typeof obj[index]=='object'?deepClone(obj[index]):obj[index];
			newObj[index] = tmp;
		}	
		return newObj;
	}

	 
	var obj = {
		a: "hello",
		b:{
			a: "world",
			b: 21
		},
		b2:{
			a: "hello",
			b: 12
		},
		c:["Bob", "Tom", "Jenny"],
		d:[1,2,3],
		e:function() {
			alert("hello world");
		}
	};
	var cloneObj = simpleClone(obj);
	var deepCloneObj = deepClone(obj)
	console.log(cloneObj);
	console.log(deepCloneObj)
	
	obj.a = "changed";
	console.log("深拷贝")
	console.log(deepCloneObj.a)
	console.log("浅拷贝")
	console.log(cloneObj.a)
	
	obj.b.a='changed';
	console.log("深拷贝")
	console.log(deepCloneObj.b.a)
	console.log("浅拷贝")
	console.log(cloneObj.b.a)
	
	obj.b2={a:"hello2",b:122};
	console.log("深拷贝")
	console.log(deepCloneObj.b2)
	console.log("浅拷贝")
	console.log(cloneObj.b2)
	
	obj.c[0] = "Daming";
	console.log("深拷贝")
	console.log(deepCloneObj.c[0])
	console.log("浅拷贝")
	console.log(cloneObj.c[0])
	
	obj.d = [4,5,6];
	console.log("深拷贝")
	console.log(deepCloneObj.d)
	console.log("浅拷贝")
	console.log(cloneObj.d)
	
	obj.e=function(){alert(11)};
	console.log("深拷贝")
	console.log(deepCloneObj.e)
	console.log("浅拷贝")
	console.log(cloneObj.e)

可见：如果修改一个对象中的object或array的某个属性，即只对深层修改，则浅拷贝也会随之修改，深拷贝会保持不变。而如果直接修改第一层，包括对象和属性，则深拷贝浅拷贝都会保持不变。

参考文章：https://blog.csdn.net/weixin_37719279/article/details/81240658?depth_1-utm_source=distribute.pc_relevant.none-task&utm_source=distribute.pc_relevant.none-task