1. 程式人生 > >關於js 淺拷貝 深拷貝 以及賦值操作。

關於js 淺拷貝 深拷貝 以及賦值操作。

進行 deep 都是 包括 是否 個數 實現 拷貝 return

最近同事又碰到關於深淺拷貝以及賦值的問題,今天我也研究一下記錄一下,加深一下記憶。

  舉一個簡單的例子:

  var people = {
    age:10,
    name:"小華",

    arr:[1,2,3]

  };
  做一個 賦值操作:

  var people2 = people;
  然後做一個淺拷貝操作:
  var people3 = {};
  for (var i in people){
    people3[i] = people[i]
  };
  然後最後再做一個深拷貝操作:
  function deepClone (obj) {

   if (typeof obj != "object") {
     return obj;
   }  

   var newObj = obj.constructor === Array ? [] : {}; //開辟一塊新的內存空間

   for (var i in obj) {
     newObj [i] = deepClone(obj [i]); //通過遞歸實現深層的復制
   }

   return newObj;
  }
  var people4 = deepClone(people);

  ------------------------------------------------------重點分割線---------------------------------------------

  下面開始進行對原數據進行操作。(people2,3,4的值請自行console ^_^)

  people.age = 1;

  發現就只有people1的age發生改變,其他的都是10。改變 people 同時也會改賦值對象 people2,而改變淺拷貝得到的 people3 和深拷貝people4都沒有改變。這就可以說明賦值得到的對象 people2 只是將指針改變,其引用的仍然是同一個對象,而淺拷貝得到的的 people3 和深拷貝的people4則是重新創建了新對象。

下面開始第二波操作: (people2,3,4的值請自行console ^_^)

  people.arr[0] = 5 

  接下來來看一下改變引用類型會是什麽情況呢,我又改變了原始對象people的arr裏面的數據,(arr是一個數組,也就是引用類型)。結果看輸出可以看出來無論是賦值操作出來的people2還是淺拷貝的people3都會也都會改變。只有通過的深拷貝得到的people4沒有改變。這是因為淺拷貝他只是復制一層對象的屬性,並不包括對象裏面的為引用類型的數據。所以就會出現people改變引用類型時,會使people3改變。

所以我們可以得出結論:

--- | 和原數據是否指向同一對象 | 第一層數據為基本數據類型 |原數據中包含子對象

賦值 | 是            | 改變會使原數據一同改變 | 改變會使原數據一同改變

淺拷貝 | 否 | 改變不會使原數據一同改變 | 改變會使原數據一同改變

深拷貝 | 否 | 改變不會使原數據一同改變 | 改變不會使原數據一同改變

關於js 淺拷貝 深拷貝 以及賦值操作。