浅克隆=>深克隆

170 阅读1分钟

什么是深克隆,什么是浅克隆

  • 深克隆:把A赋值给B,改变A或者B,另一方不随着改变
  • 浅克隆:把A赋值给B,改变A或者B,另一方随着改变

基本数据类型的复制是深克隆

引用数据类型的复制是浅克隆

将浅克隆改成深克隆的思想是将引用数据类型的复制换成基本数据类型复制

方法一

JSON

var obj =  {
    name: 'zs',
    age: 18
}
var obj1 = JSON.stringify(obj);
obj1 =JSON.parse(obj1);
obj1.age = 20;
console.log(obj)
console.log(obj1)

方法二

var obj2 = {
    name: 'xm',
    age: 21,
    info :{
        height: '165cm',
        weight: '50kg'
    }
}
function deepClone(obj){
    var tmp = {};
    for(var key in obj){
        if(typeof(obj[key] === 'object'){
            tmp[key] = deepClone(obj[key])
        }else{
            tmp[key] = obj[key]
        }
    }
    return tmp;
}
var obj3 = deepClone(obj2)
obj3.info.weight = '54kg';
console.log(obj2);
console.log(obj3);

方法三

ES6中的使用扩展运算符进行复制是深克隆 适用于数组与对象

let a = [1,2,3];
let b = [...a];
b[1] = 4;
console.log(a);
console.log(b);

ES6中对象合并浅拷贝 原因obj5接在obj4后面 返回obj4 将obj4直接复制给obj6为浅拷贝

let obj4 = {
    name = 'hh',
    age = '15',
}
let obj5 = {
    height = '160cm',
    weigth = '45kg',
}
let obj6 = Object.assign(obj4,obj5);
console.log(obj6);
console.log(obj4);
console.log(obj5);
obj6.age = 20;
console.log(obj6);
console.log(obj4);
console.log(obj5);

ES6中对象合并深拷贝

let obj4 = {
    name = 'hh',
    age = '15',
}
let obj5 = {
    height = '160cm',
    weigth = '45kg',
}
let obj6 = Object.assign({},obj4,obj5);
console.log(obj6);
console.log(obj4);
console.log(obj5);
obj6.age = 20;
console.log(obj6);
console.log(obj4);
console.log(obj5);