美文网首页
JS中的浅拷贝、深拷贝(递归实现)

JS中的浅拷贝、深拷贝(递归实现)

作者: David_Rao | 来源:发表于2020-01-06 11:20 被阅读0次

浅拷贝

复杂数据类型的数据复制的是地址,修改会被“共享”
方式一,使用copyObj[key] = obj[key]

var obj = {name: 'David', age: 18, pets: ['阿猫', '阿狗']};
var copyObj = {};
for(var key in obj){
    copyObj[key] = obj[key];
}
obj.name = '周杰伦';
obj.pets.push('小黑');
console.log(obj);  // name:'周杰伦', age:18, pets:["阿猫", "阿狗", "小黑"]
console.log(copyObj);  // name:'David', age:18, pets:["阿猫", "阿狗", "小黑"]

方式二,使用Object.assign()

var obj = {name: 'David', age: 18, pets: ['阿猫', '阿狗']};
var copyObj = {};

Object.assign(copyObj, obj, {address: '广州'});

obj.name = '周杰伦';
obj.pets.push('小黑');
console.log(obj);  // name:'周杰伦', age:18, pets:["阿猫", "阿狗", "小黑"]
console.log(copyObj);  // name:'David', age:18, address:'广州', pets:["阿猫", "阿狗", "小黑"]

深拷贝

复杂数据类型的数据复制到新的地址,修改不会被“共享”

var obj = {
    name: 'David',
    age: 18,
    friends: ['小明', '小红', '小黑'],
    bestFriend: {
        name: '小黑',
        age: 19,
        address: '广州',
        pets: [{name: '土豆'}, {name: '马铃薯'}]
    },
    birthday: new Date()
};

function deepCopy2NewObj(fromObj, toObj) {
    for(var key in fromObj){
        var fromValue = fromObj[key];
        if(!isObj(fromValue)){
            toObj[key] = fromValue;
        }else{
            var tempObj = new fromValue.__proto__.constructor;
            deepCopy2NewObj(fromValue, tempObj);  // 递归
            toObj[key] = tempObj;
        }
    }
}

function isObj(obj) {
    return obj instanceof Object;
}

function isArr(obj) {
    return Array.isArray(obj);
    // return Object.prototype.toString.call(obj) === '[object Array]';  // 方式2
}

var newObj = {};
deepCopy2NewObj(obj, newObj);
console.log(obj);
console.log(newObj);

相关文章

  • Javascript中的深拷贝

    JS 中深拷贝的几种实现方法 1、使用递归的方式实现深拷贝 //使用递归的方式实现数组、对象的深拷贝 functi...

  • js浅拷贝深拷贝

    js浅拷贝,深拷贝的简单实现 基础数据 浅拷贝 深拷贝

  • JS 中深拷贝的几种实现方法

    JS 中深拷贝的几种实现方法 1、使用递归的方式实现深拷贝 方法二 2、通过 JSON 对象实现深拷贝 缺点 (1...

  • JS中的深拷贝与浅拷贝

    知乎:js中的深拷贝和浅拷贝? 掘金: js 深拷贝 vs 浅拷贝 前言 首先深拷贝与浅拷贝只针对 Object,...

  • 对象的浅拷贝和深拷贝

    对象的深拷贝和浅拷贝 如何 实现一个深拷贝 递归拷贝1、外部库 lodash =>cloneDeep2、自实现

  • 对象深拷贝和浅拷贝

    浅拷贝 深拷贝 深拷贝的递归方法 深拷贝的JSON方法

  • 受虐之路(2)

    1.深拷贝与浅拷贝深拷贝只针对复杂数据类型如何实现深拷贝?1)递归function deepClone(obj){...

  • JS中的浅拷贝、深拷贝(递归实现)

    浅拷贝 复杂数据类型的数据复制的是地址,修改会被“共享”方式一,使用copyObj[key] = obj[key]...

  • 浅拷贝和深拷贝

    本文参考:JavaScript中的浅拷贝和深拷贝js 深拷贝 vs 浅拷贝深入剖析 JavaScript 的深复制...

  • JS深拷贝的实现

    JS深拷贝, 即传值拷贝, 需要新建一处内存,实现拷贝,具体实现如下: //ES5深拷贝 (1)循环递归: fun...

网友评论

      本文标题:JS中的浅拷贝、深拷贝(递归实现)

      本文链接:https://www.haomeiwen.com/subject/cpnhactx.html