引用类型的深拷贝

普通对象

1、Object.assign({}, obj);
var a = {'name': 'xiaoyu'};
var b = Object.assign({}, a);
b.name = 'xiaoyu2';
console.log(a.name);//xiaoyu2
复制代码
2、JSON.parse(JSON.stringify(obj))
var a = {'name': 'xiaoyu'};
var b = JSON.parse(JSON.stringify(a));
b.name = 'xiaoyu2';
console.log(a.name);//xiaoyu2
复制代码
3、for循环赋值
var extentObj = function(obj1,obj2){
    //遍历obj2中属性
    for(let key in obj2){ 
        //判断obj1不存在此属性
        if(obj2.hasOwnProperty(key) && (!obj1.hasOwnProperty(key))){ 
            //将此值赋给obj1
            obj1[key] = obj2[key] 
        }
    }
}
复制代码
4、扩展运算符
var a = {'name': 'xiaoyu'};
var { ...b } = a;
b.name = 'xiaoyu2';
console.log(a.name);//xiaoyu2
复制代码

对象数组

1、for循环赋值
var arr = {
    userName:"xiaoyu",
    roles:[{id:1},{id:2}]
}
//或
//var arr = {
//    userName:"xiaoyu",
//    role:{
//        id:1,
//        name:"管理员"
//    }
//}
var arr2 = objDeepCopy(arr);
function objDeepCopy(arr) {
    let res = {};
    for (let key in arr) {
        if(typeof arr[key] === 'object'){ //判断是否是对象类型
            if(arr[key] instanceof Array){ //进一步判断是否是数组
                res[key] = [];
                for(let item of arr[key]){
                res[key].push(objDeepCopy(item)); //递归判断当前值
                }
            }else{
                res[key] = objDeepCopy(arr[key]);
            }
        }else{
            res[key] = arr[key];
        }
    }
    return res
}
arr.roles[0].id = 4;
console.log(arr); //{name:"xiaoyu2",roles:[{id:4},{id:2}]
console.log(arr2); //{name:"xiaoyu",roles:[{id:1},{id:2}]
复制代码

普通数组

1、for循环赋值
var arr = [1,2,3,4,5]
var arr2 = copyArr(arr)
function copyArr(arr) {
    let res = []
    for (let i = 0; i < arr.length; i++) {
        res.push(arr[i])
    }
    return res
}
复制代码
2、slice方法
var arr = [1,2,3,4,5]
var arr2 = arr.slice(0)
arr[2] = 5
console.log(arr)
console.log(arr2)
复制代码
3、concat 方法
var arr = [1,2,3,4,5]
var arr2 = arr.slice(0)
arr[2] = 5
console.log(arr)
console.log(arr2)
复制代码
4、ES6扩展运算符
var arr = [1,2,3,4,5]
var [ ...arr2 ] = arr
arr2[2] = 5
console.log(arr)
console.log(arr2)
复制代码

转载于:https://juejin.im/post/5bd8114b51882558bd3f0a0e

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值