理解js淺拷貝和深拷貝

理解深拷貝和淺拷貝以前先了解下js中的基本類型和引用類型

一、基本類型：

在js中，數據的基本類型undefined，null，string，number，boolean，在變量中賦的實際值，基本類型就是簡單的數據段。

基本類型的值是不能夠改變的

var a = 1;

var b = a;

a++;

console.log(a); //2

console.log(b); //1

這裏a和b是獨立的，當改變a或b，其另一個值不會隨之改變

二、引用類型：

在js中，數據的引用類型object,Array,RegExp,date,function，在變量中賦的實際值

引用類型的值是能夠改變的

var arr = [1,2,3,4,5];

var arr2 = arr;

arr[0] = 2;

console.log(arr); //[二、二、三、四、5]

console.log(arr2);//[二、二、三、四、5]

這裏在改變arr[0]中的值後，arr2數據也跟着改變，引用類型在賦值的時候(arr2=arr),其實在棧內存中添加了arr2，可是堆內存中仍是[1,2,3,4,5]，通俗點講就是引用類型賦值並不是真正意義上的數據賦值，而是在棧內存中添加一個指針，仍是指向堆內存中的[1,2,3,4,5],只添加棧內存的指針

 

好，到這裏咱們在討論深拷貝和淺拷貝，深拷貝顧名思義是在數據是相互獨立的，改數據而另外一個不受影響，淺拷貝則是數據會隨之改變而改變。

這麼一看，基本類型不正好是嘛，數據都是相互獨立的，乍看好像還真是的。

可是，可是，咱們所說的深拷貝必需要在複雜的object類型下，基本類型裏沒有object，那麼只能是引用類型。

再來看個例子:

var arr3 = [[1,2],3,4,5];

var arr4 = arr3;

arr3[0][1] = 3;

console.log(arr3); //[[1,3],3,4,5]

console.log(arr4); //[[1,3],3,4,5]

明明改了arr3，爲什麼arr4也改了，這不是我想要的，那如何獨立呢，你會發現使用什麼for循環，slice，concat是根本無論用的，網上有其餘的坑，在此我就很少說了，直接說解決辦法

 

方法一、JSON

利用JSON.stringify和JSON.parse

var arr3 = [[1,2],3,4,5];

var arr4 = JSON.parse(JSON.stringify(arr3));

arr3[0][1] = 3;

console.log(arr3); //[[1,3],3,4,5]

console.log(arr4); //[[1,2],3,4,5]

可是這種方法有個小弊端，就是值不能爲undefined或null，最好對數據提早判斷

方法二、jq $.extend

$.extend([deep],target,object1[,objextN]);    //deep 值爲true或false，true爲深拷貝，false爲淺拷貝。target 目標對象，其餘對象的成員屬性將被附加到該對象上 object1/objextN 是須要被操做的對象，能夠是多個，這裏是例子中的arr3

var arr3 = [[1,2],3,4,5];

var arr4 = $.extend(true,[],arr3);

arr3[0][1] = 3;

console.log(arr3); //[[1,3],3,4,5]

console.log(arr4); //[[1,2],3,4,5]

以上就是介紹的兩種方法