首页 > 其他 > 详细

深拷贝与浅拷贝的区别

时间:2019-03-29 20:15:05      阅读:147      评论:0      收藏:0      [点我收藏+]

1、回顾

技术分享图片
数据传递的方法:

    值传递:基本数据类型的数据不会发改变,因为基本数据类型一般存放在栈里面,值传递只是将数据拷贝了一份给另一个变量

    引用传递:会改变内存中的数据,因为引用类型的数据都存放在堆里面,栈里面存放的是索引,拷贝的时候是拷贝的地址也就是索引

例如:

    值传递

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


    引用传递

    var arr = [10,20,30,40];
    var newArr = arr;
    newArr[0] = 80;
    console.log(arr);//[80,20,30,40]
    console.log(newArr);//[80,20,30,40];

    因为引用数据类型传递是保存了内存中的地址,当一个数据发生改变的时候 地址里面的数据也会发送改变
技术分享图片

 

2、浅拷贝

技术分享图片
浅拷贝:所谓的浅拷贝就是复制一份引用数据类型的地址,当改变了内存中数据的某一个值得话,也会影响到另一个对象

浅拷贝的方式:
   
   浅拷贝1
    var obj = {name:"张三",age:19,sex:"男"}
    var newObj = obj;

    newObj.name="李四";
    console.log(obj);//{name:"李四",age:19,sex:"男"}
    console.log(newObj);//{name:"李四",age:19,sex:"男"}


    浅拷贝2 
        Object.assgin()
        参数1:目标对象
        参数2:任意多个对象

        如果对象是多层的话
        var obj = {data:{a:1,b:2,c:3}};

        var obj1 = Object.assign({},obj);
        obj1.data.a = 10;
        console.log(obj);//{data:{a:10,b:2,c:3}}


    浅拷贝3
        封装CopyAttr()
        如果对象是多层的话
    function copyAttr(obj){
        var newObj = {};
        for(var key in obj){
            newObj[key] = obj[key];
        }
        return newObj;
    }

    var obj = {data:{a:1,b:2,c:3}};
    var newObj = copyAttr(obj);
    newObj.data.a = 10;
    console.log(obj)//{data:{a:10,b:2,c:3}}


  浅拷贝4
        $.extend({},obj)
        var obj = {data:{a:1,b:2,c:3}};
        var newObj = $.extend({},obj);
        newObj.data.a = 10;
        console.log(obj);//{a: 10, b: 2, c: 3}
        console.log(newObj);//{a: 10, b: 2, c: 3}
技术分享图片

3、深拷贝

技术分享图片

深拷贝:所谓的深拷贝就是复制一份引用数据类型的数据,当改变了数据的某一个值得话,不会影响到另一个对象(注意深拷贝是拷贝的数据,而不是索引,浅拷贝拷贝的是索引而不是数据)

深拷贝1 Object.assign(); 如果对象只有一层的 var obj = {a:1,b:2,c:3}; var newObj = Object.assign({},obj); newObj.a = 10; console.log(obj);//{a: 1, b: 2, c: 3} console.log(newObj);//{a: 10, b: 2, c: 3} 深拷贝2 $.extend(true,{},obj) var obj = {a:1,b:2,c:3}; var newObj = $.extend(true,{},obj); newObj.a = 10; console.log(obj);//{a: 1, b: 2, c: 3} console.log(newObj);//{a: 10, b: 2, c: 3} 深拷贝3 JSON.stringify() var obj = {data:{a:1,b:2,c:3}}; var newObj = JSON.parse(JSON.stringify(obj)); newObj.data.a = 10; console.log(obj);//{a: 1, b: 2, c: 3} console.log(newObj);//{a: 10, b: 2, c: 3} 缺点:没有办法将函数转换为json

深拷贝与浅拷贝的区别

原文:https://www.cnblogs.com/wswm/p/10623455.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!