對象的拷貝(clone)(深拷貝和淺拷貝)

  • 什么是對象的拷貝?
    將一個對象賦值給另外一個對象, 我們稱之為對象的拷貝

  • 什么是深拷貝, 什么是淺拷貝?
    例如:將A對象賦值給B對象

  • 淺拷貝是指, 修改B對象的屬性和方法會影響到A對象的屬性和方法, 我們稱之為淺拷貝

        function Person(name, age, dog) {
         this.name = name;
         this.age = age;
         this.say = function () {
             console.log(this.name, this.age);
         };
         this.dog = dog;
     }
     var p1 = new Person("luodou", 13, {
         name: "wc",
         age: "3"
     });
    
     // 1.對象之間的直接賦值
     /*
     // 將p1對象賦值給p2對象
     // 本質上是p1和p2都指向了同一塊存儲空間
     // 所以無論是修改p1還是p2都會影響到另外一個
     // 所以下列代碼是淺拷貝
     var p2 = p1;
     console.log(p1.name);
     p2.name = "zq";
     console.log(p1.name);
     */
    
     // 2.對象屬性的逐一賦值
     var p2 = new Person();
    
     copy(p1, p2);
     function copy(o1, o2){
         for(var key in o1){
             o2[key] = o1[key];
         }
     }
    
     console.log(p2);
    
     console.log(p1.dog.name);  //wc
     p1.dog.name = "mm";
     console.log(p1.dog.name);  //mm
    
  • 深拷貝是指, 修改B對象的屬性和方法不會影響到A對象的屬性和方法, 我們稱之為深拷貝

    function Person(name, age, dog) {
        this.name = name;
        this.age = age;
        this.say = function () {
            console.log(this.name, this.age);
        };
        this.dog = dog;
    }
    // var p1 = new Person("lnj", 13, {
    //     name: "wc",
    //     age: "3"
    // });
    var p1 = new Person("lnj", 13,{
        name: "wc",
        age: "3"
    });
    /*
    //若傳入的是數組也一樣,數組也是對象
      var p1 = new Person("lnj", 13,[1,3,5]);
     */
    var p2 = new Person();

    function deepCopy(o1, o2){
        // 取出第一個對象的每一個屬性
        for(var key in o1){
            // 取出第一個對象當前屬性對應的值
            var item = o1[key]; // dog
            // 判斷當前的值是否是引用類型
            // 如果是引用類型, 我們就重新開辟一塊存儲空間
            if(item instanceof Object){
                var temp = new Object();
                /*
                {name: "wc",age: "3"}
                 */
               deepCopy(item, temp);   //遞歸
                o2[key] = temp;
            }else{
                // 基本數據類型
                o2[key] = o1[key];
            }
        }
    }

    deepCopy(p1, p2);
    console.log(p1.dog.name); // wc
    p2.dog.name = "mm";
    console.log(p1.dog.name); // wc

    /*
    deepCopy(p1, p2);
    console.log(p1.dog); // wc
    p2.dog = [2,4,6];
    console.log(p2);
    console.log(p1.dog); // wc
     */
  • 注意點:
    • 默認情況下對象之間的直接賦值都是淺拷貝

    • 默認情況下一個對象的屬性如果是基本數據類型, 那么都是深拷貝

    • 如果對象的屬性包含了引用數據類型, 才真正的區(qū)分深拷貝和淺拷貝

?著作權歸作者所有,轉載或內容合作請聯系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

  • 第2章 基本語法 2.1 概述 基本句法和變量 語句 JavaScript程序的執(zhí)行單位為行(line),也就是一...
    悟名先生閱讀 4,616評論 0 13
  • var a = 1; console.log(typeof a);// 'number' var b = '1';...
    zdnexus閱讀 420評論 0 0
  • 一、快捷鍵 ctr+b 執(zhí)行ctr+/ 單行注釋ctr+c ...
    o_8319閱讀 6,047評論 2 16
  • 工廠模式類似于現實生活中的工廠可以產生大量相似的商品,去做同樣的事情,實現同樣的效果;這時候需要使用工廠模式。簡單...
    舟漁行舟閱讀 8,140評論 2 17
  • 模糊的側臉閱讀 345評論 0 0

友情鏈接更多精彩內容