国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

JavaScript深拷貝、淺拷貝

Scorpion / 3547人閱讀

摘要：深拷貝淺拷貝淺拷貝淺拷貝只是復制了內存地址，如果原地址中的對象改變了，淺拷貝出來的對象也會相應改變。也就是深拷貝之后，不管這個對象原來的構造函數是什么，在深拷貝之后都會變成。

JavaScript深拷貝、淺拷貝 
淺拷貝：淺拷貝只是復制了內存地址，如果原地址中的對象改變了，淺拷貝出來的對象也會相應改變。  
深拷貝：開辟了一塊新的內存存放地址和地址指向的對象，原地址的任何對象改變了，深拷貝出來的對象不變。
淺拷貝數組（只拷貝第一級數組）：
1.直接遍歷
var arr = [1,2,3,4];

function copy(arg){  
  var newArr = [];
  for(var i = 0; i < arr.length; i++) {
    newArr.push(arr[i]);
  }
  return newArr;
}

var newArry = copy(arr);
console.log(newArry);
newArry[0] = 10;
console.log(newArry); // [10,2,3,4]
console.log(arr)  // [1,2,3,4]
2.slice
var arr = [1,2,3,4]
var copyArr = arr.slice();
copyArr[0] = 10;
console.log(copyArr); // [10,2,3,4]
console.log(arr); // [1,2,3,4]
slice(start,end)，slice()方法返回一個數組中復制出來的元素組成新數組，start指起始元素下標，end指終止元素下標

當slice()不帶任何參數時，默認返回一個和原數組一樣的新數組

3.concat()
var arr = [1,2,3,4]
var copyArr = arr.concat();
copyArr[0] = 10;
console.log(copyArr); // [10,2,3,4]
console.log(arr); // [1,2,3,4]
array.concat(array1,array2,.......,arrayN)，concat()方法用于連接兩個或多個數組（不會改變原數組，返回被連接數組的副本）
然而如果第一級數組元素是對象或數組，上面三種方式都失效：
var arr = [
  {number:1},
  {number:2},
  {number:3}
  
]
var copyArr = arr.slice();
copyArr[0].number = 10;
console.log(copyArr);  // [{number: 100}, { number: 2 },{ number: 3 }]
console.log(arr); // [{number: 100}, { number: 2 }, { number: 3 }]
淺拷貝對象（如果對象中的值不為數組或對象）
1.直接遍歷
  var obj = {
    name: "張三",
    job: "學生"
  }
  
  function copy (arg) {
    let newobj = {}
    for(let item in arg) {
      newobj[item] = arg[item];
    }
    return newobj;
  }
  
  var copyobj = copy(obj)
  copyobj.name = "李四"
  console.log(copyobj) // {name: "李四", job:: "學生"}
  console.log(obj) // {name: "張三", job:: "學生"}
2.ES6的Object.assign
var obj = {
  name: "張三",
  job: "學生"
}

var copyobj = Object.assign({},obj)
copyobj.name = "李四"
console.log(copyobj) // {name: "李四", job:: "學生"}
console.log(obj)    // {name: "張三", job:: "學生"}
Object.assign：用于對象的合并，將源對象（source）的所有可枚舉屬性，復制到目標對象（target），并返回合并后的target  
用法： Object.assign(target, source1, source2); 所以 copyObj = Object.assign({}, obj); 這段代碼將會把obj中的一級屬性都拷貝到 ｛｝中，然后將其返回賦給copyObj

3.ES6擴展運算符

var obj = {
  name: "張三",
  job: "學生"
}

var copyobj = {...obj}
copyobj.name = "李四"
console.log(copyobj)
console.log(obj)
擴展運算符（...）用于取出參數對象的所有可遍歷屬性，拷貝到當前對象之中
深拷貝

JSON.stringify()和JSON.parse()

用JSON.stringify把對象轉成字符串，再用JSON.parse把字符串轉成新的對象。

但是這種方法也有不少壞處，譬如它會拋棄對象的constructor。也就是深拷貝之后，不管這個對象原來的構造函數是什么，在深拷貝之后都會變成Object。

這種方法能正確處理的對象只有 Number, String, Boolean, Array, 扁平對象，即那些能夠被 json 直接表示的數據結構。RegExp對象是無法通過這種方式深拷貝。

也就是說，只有可以轉成JSON格式的對象才可以這樣用，像function、undefined、symbol、循環引用的對象沒辦法轉成JSON。

var obj1 = { fun: function(){ console.log(123) } };
var obj2 = JSON.parse(JSON.stringify(obj1));
console.log(typeof obj1.fun);
// "function"
console.log(typeof obj2.fun);
// "undefined" <-- 沒復制
使用遞歸函數實現一個深拷貝的方法:
function deepClone(obj) {
    let objClone = Array.isArray(obj) ? [] : {};
    if(obj && typeof obj === "object") {
        for(key in obj) {
            if(obj.hasOwnProperty(key)) {
                if(obj[key] && typeof obj[key] === "object") {
                    objClone[key] = deepClone(obj[key]);
                } else {
                    objClone[key] = obj[key];    
                }
             }
         } 
    }
    return objClone
}

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/101413.html

相關文章

  • JavaScript中的淺拷貝與深拷貝

    摘要：所以，深拷貝是對對象以及對象的所有子對象進行拷貝實現方式就是遞歸調用淺拷貝對于深拷貝的對象，改變源對象不會對得到的對象有影響。 上一篇 JavaScript中的繼承 前言 文章開始之前，讓我們先思考一下這幾個問題： 為什么會有淺拷貝與深拷貝 什么是淺拷貝與深拷貝 如何實現淺拷貝與深拷貝 好了，問題出來了，那么下面就讓我們帶著這幾個問題去探究一下吧！ 如果文章中有出現紕漏、錯誤之處...

    AZmake 評論0 收藏0

  • JavaScript中的淺拷貝與深拷貝

    摘要：所以，深拷貝是對對象以及對象的所有子對象進行拷貝實現方式就是遞歸調用淺拷貝對于深拷貝的對象，改變源對象不會對得到的對象有影響。 為什么會有淺拷貝與深拷貝什么是淺拷貝與深拷貝如何實現淺拷貝與深拷貝好了，問題出來了，那么下面就讓我們帶著這幾個問題去探究一下吧！ 如果文章中有出現紕漏、錯誤之處，還請看到的小伙伴多多指教，先行謝過 以下↓ 數據類型在開始了解 淺拷貝 與 深拷貝 之前，讓我們先...

    546669204 評論0 收藏0

  • JavaScript中的淺拷貝和深拷貝

    摘要：在中可以通過添加一個參數來實現遞歸，調用就可以實現一個深拷貝。利用序列化實現一個深拷貝 在JavaScript中，對于Object和Array這類引用類型值，當從一個變量向另一個變量復制引用類型值時，這個值的副本其實是一個指針，兩個變量指向同一個堆對象，改變其中一個變量，另一個也會受到影響。 這種拷貝分為兩種情況：拷貝引用和拷貝實例，也就是我們說的淺拷貝和深拷貝 淺拷貝（shallow...

    ernest.wang 評論0 收藏0

  • javascript對象的淺拷貝、深拷貝和Object.assign方法淺析

    摘要：對象的淺拷貝淺拷貝是對象共用一個內存地址，對象的變化相互影響。這是特別值得注意的地方。和能正確處理的對象只有等能夠被表示的數據結構，因此函數這種不能被表示的類型將不能被正確處理。 對象的淺拷貝： 淺拷貝是對象共用一個內存地址，對象的變化相互影響。比如常見的賦值引用就是淺拷貝: let srcObj = {name: lilei, age: 20}; let copyObj = srcO...

    lixiang 評論0 收藏0

  • 關于js的淺拷貝與深拷貝

    摘要：原文地址淺拷貝和深拷貝只針對像這樣的復雜對象的簡單來說，淺拷貝只拷貝一層對象的屬性，而深拷貝則遞歸拷貝了所有層級。淺拷貝通過來實現淺拷貝。 原文地址：http://www.silenceboy.com/201... 淺拷貝和深拷貝只針對像Object, Array這樣的復雜對象的.簡單來說，淺拷貝只拷貝一層對象的屬性，而深拷貝則遞歸拷貝了所有層級。 淺拷貝 通過 Object.ass...

    summerpxy 評論0 收藏0

  • JavaScript系列--淺析JavaScript解析賦值、淺拷貝和深拷貝的區別

    摘要：它將返回目標對象。有些文章說是深拷貝，其實這是不正確的。深拷貝相比于淺拷貝速度較慢并且花銷較大。拷貝前后兩個對象互不影響。使用深拷貝的場景完全改變變量之后對沒有任何影響，這就是深拷貝的魔力。 一、賦值（Copy） 賦值是將某一數值或對象賦給某個變量的過程，分為： 1、基本數據類型：賦值，賦值之后兩個變量互不影響 2、引用數據類型：賦址，兩個變量具有相同的引用，指向同一個對象，相互之間有...

    laznrbfe 評論0 收藏0

發表評論

0條評論

最新活動
閱讀需要支付1元查看
<