深拷贝和浅拷贝

1.深拷贝和浅拷贝的区别
浅拷贝(shallow copy):只复制指向某个对象的指针,而不复制对象本身,新旧对象共享一块内存;
深拷贝(deep copy):复制并创建一个一摸一样的对象,不共享内存,修改新对象,旧对象保持不变。

var a = 25;
var b = a;
b = 10;
console.log(a);//25
console.log(b);//10

//浅拷贝
var obj1 = { a: 10, b: 20, c: 30 };
var obj2 = obj1;
obj2.b = 40;
console.log(obj1);// { a: 10, b: 40, c: 30 } 
console.log(obj2);// { a: 10, b: 40, c: 30 }

//深拷贝
var obj1 = { a: 10, b: 20, c: 30 };
var obj2 = { a: obj1.a, b: obj1.b, c: obj1.c };
obj2.b = 40;
console.log(obj1);// { a: 10, b: 20, c: 30 }
console.log(obj2);// { a: 10, b: 40, c: 30 }

2.浅拷贝实现

var json1 = {"a":"name","arr1":[1,2,3]}
function copy(obj1) {
    var obj2 = {};
    for (var i in obj1) {
      obj2[i] = obj1[i];
    }
    return obj2;
}
var json2 = copy(json1);
json1.arr1.push(4);
alert(json1.arr1);  //1234
alert(json2.arr1)  //1234

3.深拷贝实现
(1)Object.assign()

let foo = {
    a: 1,
    b: 2,
    c: {
        d: 1,
    }
}
let bar = {};
Object.assign(bar, foo);
foo.a++;
foo.a === 2 //true
bar.a === 1 //true
foo.c.d++;
foo.c.d === 2 //true
bar.c.d === 1 //false
bar.c.d === 2 //true

注意:Object.assign()是一种可以对非嵌套对象进行深拷贝的方法,如果对象中出现嵌套情况,那么其对被嵌套对象的行为就成了普通的浅拷贝。

(2)转成JSON
用JSON.stringify把对象转成字符串,再用JSON.parse把字符串转成新的对象。

var obj1 = { body: { a: 10 } };
var obj2 = JSON.parse(JSON.stringify(obj1));
obj2.body.a = 20;
console.log(obj1);   // { body: { a: 10 } } 
console.log(obj2);   // { body: { a: 20 } }
console.log(obj1 === obj2);   // false
console.log(obj1.body === obj2.body);   // false

注意:但这种方法的缺陷是会破坏原型链,并且无法拷贝属性值为function的属性

(3)递归
采用递归的方法去复制拷贝对象

var obj1={a:{b:"name",c:1}};
var obj2={};

function deepClone(obj1,obj2){
    var obj=obj2||{};
    for(var i in obj1){
        var prop=obj1[i];
        if(prop == obj)     //避免相互引用对象导致死循环
            continue;
        if(typeof prop === 'object'){
            obj[i]=(prop.constructor === Array)?[]:{};
            arguments.callee(prop,obj[i]);
        }else{
            obj[i]=prop;
        }   
    }
    return obj;
}

deepClone(obj1,obj2);
console.log(obj2.a);

(4)使用Object.create()方法
直接使用var newObj = Object.create(oldObj),可以达到深拷贝的效果。

function deepClone(obj1,obj2){
    var obj=obj2||{};
    for(var i in obj1){
        var prop=obj1[i];
        if(prop == obj)     //避免相互引用对象导致死循环
            continue;
        if(typeof prop === 'object'){
            obj[i]=(prop.constructor === Array)?[]:Object.create(prop);
            arguments.callee(prop,obj[i]);
        }else{
            obj[i]=prop;
        }   
    }
    return obj;
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值