百木园-与人分享,
就是让自己快乐。

JavaScript 赋值,浅拷贝,深拷贝

整理、拼凑自网上的文章,只为方便自身学习阅读与理解。

https://www.jianshu.com/p/35d69cf24f1f

https://blog.csdn.net/wyp1725726792/article/details/102756183

https://www.cnblogs.com/XF-eng/p/13969211.html

https://www.ruanyifeng.com/blog/javascript/

https://www.ruanyifeng.com/blog/2010/05/object-oriented_javascript_inheritance_continued.html

一般深浅拷贝只针对复杂数组和对象

  • 什么是赋值,什么是深拷贝,什么是浅拷贝

1.赋值:    强行赋值,将两个对象的指向同一块内存地址,两个对象将发生联动。

2.浅拷贝: 将原对象或原数组的引用直接赋给新对象,新数组,新对象/数组只是原对象的一个引用

3.深拷贝: 创建一个新的对象和数组,将原对象的各项属性的“值”(数组的所有元素)拷贝过来,是“值”而不是“引用”

       理解:

1.直接赋值其实只复制了原对象的指针,引用对象和原对象指向同一个内存地址(内存共享,只是对象的名称不同而已)。这不能算真正的拷贝,因为修改引用对象时,内存地址发生改变,居然会影响原对象!!!

2.浅拷贝是创建一个完全和原对象一模一样的数组(第一层级/深度),中心思想是创建一个新对象(开辟一个新的内存地址),将原对象的属性逐个(遍历)拷贝到新的对象中。

3.深拷贝则是创建一个完全和原对象一模一样的数组(所有层级/深度),中心思想是创建一个新对象(开辟一个新的内存地址)用递归逐层复制对象。如果原对象过于复杂,使用深拷贝必然会造成不必要的性能损耗,则需要考虑是否真的使用深拷贝。

 

  •  为什么要使用深、浅拷贝?如何证明拷贝成功了

1.我们不希望拷贝生成的新数组,会改变原数组。当我们改变新数组时,原数组不会随之发生改变,即证明拷贝成功了。

  • 何时使用深拷贝,如何使用浅拷贝

1.深拷贝会导致性能的损耗。如果仅需拷贝原对象、数组的第一层级(深度),就用浅拷贝。如果需要完整拷贝,则需要使用深拷贝。

浅拷贝

// 原生js代码实现浅拷贝

let originObj = {
    name:\"paul\",
    age:19,
    address:[\'china\'],
    hobbies:[\'sing\',\'dance\',\'ball\'],
    family:{
        dad:\"tom\",
        mother:\"jerry\"
    }
};

let copyObj = copy(originObj);

copyObj.name = \"jim\"  //第一层级为基本数据类型,修改第一层级的数据不会发生改变
copyObj.age = 99;     //第一层级为基本数据类型,修改第一层级的数据不会发生改变
copyObj.address[0]= \"usa\"         // 第一层级下不是基本数据类型
copyObj.hobbies[0]=\"play games\"   // 第一层级下不是基本数据类型,修改数据会发生改变,说明拷贝已经失败
copyObj.family.mother = \"helen\"   // 第一层级下不是基本数据类型,修改数据会发生改变,说明拷贝已经失败


function copy(obj){
    let newObj = {}
    for(prop in obj){
        if (obj.hasOwnProperty(prop)) {
            newObj[prop]= obj[prop]
        }
    }
    return newObj;
};


console.log(\'原对象originObj\',originObj);
console.log(\'拷贝后的对象copyObj\',copyObj);

 

深拷贝

 

 


来源:https://www.cnblogs.com/wanglei1900/p/15924101.html
本站部分图文来源于网络,如有侵权请联系删除。

未经允许不得转载:百木园 » JavaScript 赋值,浅拷贝,深拷贝

相关推荐

  • 暂无文章