对象(包含数组)的深浅拷贝

173 阅读1分钟

浅拷贝

只复制第一层数据,不复制深层的数据

浅拷贝以下对象,复制 obj.user 对应的值, 是 { name : 'hdcms'} 这个对象的引用,修改obj.user.name时新旧对象依旧会互相影响

let obj = {  
    name: '后盾人',  
    user: {      
        name: 'hdcms'  
    }
}

1. 使用 for/in 执行对象拷贝

let obj = { name: 'wangyu' };
let newObj = {};
for (const key in obj) {  
    newObj[key] = obj[key];
}

2. 使用 Object.assign 函数

将两个对象的属性叠加,后面对象属性会覆盖前面对象同名属性。

let obj = { name: 'wangyu' };
let newObj = Object.assign({}, obj);

3. 使用展开语法

let obj = { name: 'wangyu' };
let newObj = { ...obj };

深拷贝

可以将深层的数据复制,复制一个完全独立的对象。

//deep clone
let obj = {
  name: '后盾人',
  user: {
    name: 'hdcms',
  },
  data: [],
};

function copy(obj) {
  let newObj = obj instanceof Array ? [] : {};
  for (const [key, value] of Object.entries(obj)) {
    newObj[key] = typeof value === 'object' ? copy(value) : value;
  }
  return newObj;
}

let newObj = copy(obj);
newObj.data.push('blahblah');
newObj.user.name = 'wangyu';
console.log(JSON.stringify(obj, null, 2));
console.log(JSON.stringify(newObj, null, 2));

ref: 

houdunren.gitee.io/note/js/10%…