首先我们来说下区别:
浅拷贝只是拷贝一层, 更深层次对象级别的只拷贝引用
深拷贝拷贝多层, 每一级别的数据都会拷贝
那么我们来用代码分别实现浅拷贝与深拷贝
浅拷贝
例1:
1 2 3 4 5 6 7 8 9 10 11 12 13
| var obj = { id: 1, name: 'andy', msg: { age: 18 } }; var o = {}; for (var k in obj) { o[k] = obj[k]; } console.log(o)
|
这是ES6之前的写法,Object.assign(target, …sources) es6 新增方法可以浅拷贝
例2:
1 2 3 4 5 6 7 8 9 10
| var obj = { id: 1, name: 'andy', msg: { age: 18 } }; var o = {}; Object.assign(o, obj);
|
深拷贝
例1:用递归实现深拷贝
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35
| let obj = { name:'张三', age:22, arr:['1',2], arrObj:{ name:'李四', sex:'女' } }
let objs = {};
function deepCopy(obj1,obj2){ for (let v in obj2) { let item = obj2[v];
if(item instanceof Array){ obj1[v] = []; deepCopy(obj1[v],item) } else if(item instanceof Object){ obj1[v] = {}; deepCopy(obj1[v],item); } else{ obj1[v] = item; } } } deepCopy(objs,obj) console.log(objs)
|
例2:JSON.parse(JSON.stringify()) 这种方式我觉得算是最简单的
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20
| let obj1 = { name:'张三', age:22, arr:['1',2], arrObj:{ name:'李四', sex:'女' } }
let obj2 = {};
function deepCopy(obj){ let _obj = JSON.stringify(obj), objClone = JSON.parse(_obj); return objClone } obj2 = deepCopy(obj1) console.log(obj2)
|
需要注意的是:这种拷贝方法不可以拷贝一些特殊的属性(例如正则表达式,undefine,function)
工作中看自己实际需求,我这里写的也可能某些地方有缺陷,欢迎大佬指教