深淺拷貝

Karrdy 發布于2019-08-23 15:42 / 608人閱讀

摘要：深復制實現代碼如下第一種方法通過遞歸解析解決第二種方法通過解析解決作者六師兄鏈接原生深拷貝的實現處理未輸入新對象的情況通過方法構造新的對象

深淺拷貝針對的是對象類型，如果是字符串的數組用[...arr]，還是不會影響

要區分針對數組的深淺拷貝(默認情況為里面沒有對象的數組)，與針對對象的深淺拷貝

JavaScript數組深拷貝和淺拷貝的兩種方法

let a1 = [1, 2];
let a2 = a1;

a2[0] = 2;
a1 // [2, 2]
這個是復制了指向底層數據結構的指針
--

let a1 = [1, 2];
let a2 = [...a1];
這個是a1會返回原數組的克隆，再修改a2就不會對a1產生影響
--

let a1 = [{foo:1}];
let a2 = [...a1];
a1[0].foo=2
a2[0].foo ===>2
這時a1數組里是對象，a2克隆過去的話，對象里的值還是會隨著修改


深拷貝普遍的方法是對對象的子對象進行遞歸拷貝
// 遞歸實現一個深拷貝
function deepClone(source){
   if(!source || typeof source !== "object"){
     throw new Error("error arguments", "shallowClone");
   }
   var targetObj = source.constructor === Array ? [] : {};
   for(var keys in source){
      if(source.hasOwnProperty(keys)){
         if(source[keys] && typeof source[keys] === "object"){
           targetObj[keys] = source[keys].constructor === Array ? [] : {};
           targetObj[keys] = deepClone(source[keys]);
         }else{
           targetObj[keys] = source[keys];
         }
      } 
   }
   return targetObj;
}


有一個用JSON對象中的parse和stringify來實現深拷貝
但是源對象的方法在拷貝的過程中丟失了，這是因為在序列化JavaScript對象時，所有函數和原型成員會被有意忽略

// 利用JSON序列化實現一個深拷貝
function deepClone(source){
  return JSON.parse(JSON.stringify(source));
}
var o1 = {
  arr: [1, 2, 3],
  obj: {
    key: "value"
  },
  func: function(){
    return 1;
  }
};
var o2 = deepClone(o1);
console.log(o2); // => {arr: [1,2,3], obj: {key: "value"}}

js 深拷貝 vs 淺拷貝思維導圖

對于字符串類型，淺復制是對值的復制，對于對象來說，淺復制是對對象地址的復制，并沒   有開辟新的棧，也就是復制的結果是兩個對象指向同一個地址，修改其中一個對象的屬性，則另一個對象的屬性也會改變，而深復制則是開辟新的棧，兩個對象對應兩個不同的地址，修改一個對象的屬性，不會改變另一個對象的屬性。深復制實現代碼如下：  
第一種方法、通過遞歸解析解決   
第二種方法：通過JSON解析解決   
作者：六師兄Leon   
鏈接：https://www.zhihu.com/questio...

JavaScript 原生js深拷貝的實現

function deepCopy(initalObject,finalObject){
  var finalObject = finalObject || {} 
  // 處理未輸入新對象的情況
  for(var key in initalObject){
    if(initalObject[key] === initalObject){
      continue
    }
    if(typeof initalObject[key] === "object"){
      finalObject[key] = (initalObject[key].constructor === Array) ? [] : Object.create(initalObject[key])  //通過Object.create()方法構造新的對象
    }else{
      finalObject[key] = initalObject[key]
    }
  }
  return finalObject
}

GPU云服務器云服務器深淺拷貝深淺后拷貝預拷貝深拷貝和淺拷貝

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

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

JS專題之深淺拷貝

摘要：在之前的文章專題之數據類型和類型檢測中我有講過，中的數據類型分為兩種，基本數據類型和引用數據類型，基本數據類型是保存在棧的數據結構中的是按值訪問，所以不存在深淺拷貝問題。前言在開發過程中，偶爾會遇到這種場景，拿到一個數據后，你打算對它進行處理，但是你又希望拷貝一份副本出來，方便數據對比和以后恢復數據。那么這就涉及到了 JS 中對數據的深淺拷貝問題，所謂深淺拷貝，淺拷貝的意思就是，...

ASCH 2019-08-23 15:07 評論0 收藏0
深入理解JS深淺拷貝

摘要：深拷貝相比于淺拷貝速度較慢并且花銷較大。所以在賦值完成后，在棧內存就有兩個指針指向堆內存同一個數據。結果如下擴展運算符只能對一層進行深拷貝如果拷貝的層數超過了一層的話，那么就會進行淺拷貝那么我們可以看到和展開原算符對于深淺拷貝的結果是一樣。 JS中數據類型基本數據類型： undefined、null、Boolean、Number、String和Symbol(ES6) 引用數據類型：...

JackJiang 2019-08-23 14:31 評論0 收藏0
深淺拷貝

摘要：好像栗子不是那么好吃，那我們來看看下面的解釋吧深淺拷貝深拷貝和淺拷貝只針對像這樣的引用類型數據。深拷貝則是開啟一個新的棧，兩個對象對應兩個不同的引用地址，修改一個對象的屬性，不會改變另一個對象的屬性。拷貝顧名思義就是復制，但是它并不簡單哦，拷貝分為深淺拷貝，那么啥是深拷貝啥是淺拷貝呢，讓我們來舉個栗子，淺拷貝就是當你拷貝別人的U盤里東西時，卻沒有新建文件存放在自己的電腦里，直接在里面...

yck 2019-08-21 17:42 評論0 收藏0
Javascript對象的深淺拷貝

摘要：開門見山，有人叫對象的復制為深復制淺復制，也有人叫深拷貝淺拷貝。高級屬性修改深拷貝滿足對象的復制，淺拷貝影響原數組。關于對象的深淺拷貝，暫且探索到這里，后續有新發現再進行補充。 showImg(https://segmentfault.com/img/remote/1460000014305581); 開門見山，有人叫對象的復制為深復制淺復制，也有人叫深拷貝淺拷貝。其實都是copy。 ...

qieangel2013 2019-08-22 16:12 評論0 收藏0
9012年，當我們討論js深淺拷貝時我們在說些什么？

摘要：正文討論深淺拷貝，首先要從的基本數據類型說起根據中的變量類型傳遞方式，分為值類型和引用類型，值類型變量包括。當你拷貝的對象有多級的時候，就是深拷貝。數據不存在則對其拷貝。前言：本文主要閱讀對象：對深淺拷貝印象模糊對初級前端，想對js深淺拷貝聊一聊的中級前端。如果是對這些有完整對認知體系和解決方法的大佬，可以選擇略過。正文：討論深淺拷貝，首先要從js的基本數據類型說起：根據 J...

xeblog 2019-05-21 19:19 評論0 收藏0