js--对象的浅层复制与深度克隆

深度克隆

当对象中有引用类型的数值时，并且要求不可以改变原对象。此时需要深度克隆；
深度克隆有两种方式：递归和JSON.parse

递归

function deepClone(obj){
　　let objClone =  Array.isArray(obj) ? [] : {};
　　if (obj && typeof obj === 'object') {
　　　　for(let key in obj){
　　　　　　if (obj[key] && typeof obj[key] === 'object'){
　　　　　　　　objClone[key] = deepClone(obj[key]);
　　　　　　}else{
　　　　　　　　objClone[key] = obj[key]
　　　　　　}
　　　　}
　　}
　　return objClone;
}

通过json对象实现深度拷贝

var obj = {a:1,b:2}  
var newObj = JSON.parse(JSON.stringify(obj)); 
obj.c = 3;
console.log(obj,newObj);

注意：无法拷贝方法函数；

浅层复制对象

dom元素的复制——cloneNode

复制dom元素时使用

<div id="box"></div>
let div = document.getElementById('box');
let box2 = div.cloneNode(true);
console.log(div,box2);

es6新方法——Object.assign

不能进深度克隆

//比较常用
var obj = {a:1,b:2}  
var newObj = Object.assign({}, obj); 
obj.c = 3;
console.log(obj,newObj);

es6新方法——扩展运算符（…）

不能进深度克隆

var obj = {a:1,b:2}  
var newObj ={...obj}
obj.c = 3;
console.log(obj,newObj);