天天看點

【深拷貝VS淺拷貝】------【巷子】

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