引用类型的深拷贝

202 阅读1分钟

普通对象

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)