深拷贝与浅拷贝简单实现及原理

时间:2023-01-05 19:47:37

代码一:

let obj1={
name:'li',
skill:'web'
}

let o={};
for(let i in obj1){
o[i]=obj1[i];
}
//console.log(o);
o.age=20;
console.log(o);
console.log(obj1);

输出结果:
深拷贝与浅拷贝简单实现及原理
修改o的对象,o对象改变,obj1对象没变化。由于对象obj1的值都是原始类型,运用的浅拷贝。

修改obj1对象的skill属性为对象,完整代码如下,代码二:

let obj1={
name:'li',
skill:{
listen:'Yes',
write:'Yes'
}
}

let o={};
for(let i in obj1){
o[i]=obj1[i];
}
o.skill.talk='No';
console.log(o.skill);
console.log(obj1.skill);

结果:
深拷贝与浅拷贝简单实现及原理
修改o对象,obj1对象同时也修改,需要深度复制。

修改代码实现层级复制,代码三:

function deepCopy(obj1,obj2) {
var obj2 = obj2 || {};
for(let i in obj1){
if(typeof obj1[i]=== 'object')
{
obj2[i] = Array.isArray(obj1[i])?[]:{};
deepCopy(obj1[i],obj2[i]);
}else{
obj2[i]=obj1[i];
}
}
}

let obj1={
name:'li',
skill:{
listen:'Yes',
write:'Yes'
}
}
let obj2={};
deepCopy(obj1,obj2);
obj2.age=20;
console.log(obj1);
console.log(obj2);

运行结果:
深拷贝与浅拷贝简单实现及原理
修改obj2的对象,结果发现:obj2对象改变,obj1对象没变化。

结论:
● 深拷贝,其实就是值传递
● 深拷贝,通过实例化一个新的对象,从而在堆中开辟一块新的内存空间,使得栈中的变量名指向堆中的新内容