一文帶你淺析JavaScript數組中的深複製與淺複製

在使用JavaScript對陣列進行操作的時候，我們經常需要將陣列進行備份。以下這篇文章帶大家了解一下JavaScript陣列中的深複製與淺複製，希望對大家有幫助！

介紹數組的深複製與淺複製，首先給大家回顧回顧資料型別

資料型別

1、基本資料型態：：numberstringbooleannullundefined

• 
  儲存方式： 基本資料型別儲存在
堆疊記憶體

變數儲存的就是值

儲存方式： 引用資料型別儲存在
• 堆記憶體

  中

  變數儲存的是
位址
• 。 【相關推薦：

  javascript學習教學

  】

至於儲存方式我們來分析分析：

棧內存：引擎執行程式碼時工作的內存空間，除了引擎，也用來保存基本值和引用類型值的地址。

堆疊記憶體：用來保存一組無序且唯一的參考型別值，可以使用堆疊中的鍵名來取得。我們再來看：

var a = 2; var b = a; b++;//3 console.log(a); //2

分析分析，將a的值賦值給b，接著改變b的值，a的值沒有受到影響。但是引用資料型，那就不是這樣了，賦值的是位址。

• var arr = [1,2,3] ; var arr2 = arr ; arr2.push(4) ; console.log(arr); // arr发生了改变

  登入後複製
分析分析，arr複製的是地址，何為地址，可以比喻為一個房間，arr和arr2都是指向的這個房間，改變這個房間的結構，arr和arr2都會受到影響。如下圖
• 
  
  

了解上面後，接著重點

陣列的淺複製：只複製了位址(共享位址)

陣列的深複製：複製值

slice() 截取數組中的所有值，得到的是新數組。 就是要在堆記憶體中開闢一個新的空間。

陣列的淺層複製：

var arr = [1,2,3,4,5] ; // 数组的浅复制 --- 只是复制了地址 var arr2 = arr ; //改变其中一个数组，两个数组都会改变，

陣列的深複製：

1、定義一個新的空數組，遍歷原始數組並賦值給新數組

var arr = [1, 2, 3, 4, 5] var arr3 = []; arr.forEach(function(v) { arr3.push(v) }) console.log(arr3); arr3.push('a'); console.log(arr, arr3);//arr[1,2,3,4,5],arr3[1,2,3,4,5,'a']

slice()截取數組中的所有值，得到的是新數組

var arr3 = arr.slice() ; console.log(arr3); arr3.push('a') ; console.log(arr3);//[1,2,3,4,5,'a'] console.log(arr);//[1,2,3,4,5]

在這裡提一嘴：

基本資料型別傳遞是值,引用資料型別傳遞的是位址(形參和實參共享位址)難點難點，多維數組的深複製，以上提到的都是一維數組的深複製和淺複製

二維數組：二維數組本質上是以數組作為數組元素的數組，即“數組的數組”，例如：arr=[ [1,2,3],[1,2],[1,2,3,4]]分析下列程式碼，為二維陣列的遍歷，變數i，j代表的就是，下標為i元素（也就是陣列）中的第 j 1個元素。

var arr = [ [1, 2, 3], [4, 5, 6], [2, 3, 4] ] for (var i in arr) { for (var j in arr[i]) { console.log(arr[i][j]); } }

：三維及其以上的陣列

以上是一文帶你淺析JavaScript數組中的深複製與淺複製的詳細內容。更多資訊請關注PHP中文網其他相關文章！