js----深淺拷貝

時間 2019-11-16

標籤深淺拷貝欄目 JavaScript 简体版

原文原文鏈接

深拷貝和淺拷貝javascript

相關文章:https://juejin.im/post/5ad6b72f6fb9a028d375ecf6html

http://www.cnblogs.com/penghuwan/p/7359026.htmljava

https://yanhaijing.com/javascript/2018/10/10/clone-deep/數組

```
深淺拷貝針對的只是引用類型(array,object,map,set...等等)
```post

##### 深淺拷貝的不一樣:
1.淺拷貝就是簡單的對象屬性的賦值,而不是遞歸複製,js的存儲對象都是存地址的,因此地址沒有改變.spa

<html>


// 值類型的拷貝
var num = 1;
var num2 = num;
num2 = 3;
console.log(num,num2)

//output
1 3

//引用類型的拷貝
var obj = {c:1,d:0};
var obj2 = obj;
obj2.c = 9;
console.log(obj.c,obj2.c)

//output
9 9

//新對象發生改變,老的對象也會隨着變化,就是由於他們指向的是同一個地址
</html>htm

2.深拷貝就是使用遞歸複製,不只複製對象的各個屬性,還將對象屬性所包含的對象複製
==(對象是有原型鏈的)==對象

實現深拷貝的兩種方法:blog

(1)迭代遞歸法遞歸

for ... in (方法) 最經常使用
Reflect
lodash中的深拷貝

<html>

(2)序列化反序列化法(用的較多)

function deepCloneTwo(source){
return JSON.parse(JSON.stringify(source)) ///重要
}

var obj = {c:1,d:0};
var obj4 = deepCloneTwo(obj);
obj4.c = 0
console.log(obj.c,obj4.c)

//output
1 0
</html>

深拷貝數組呢

上述的拷貝操做,對數組(set,map)同樣可用

var mapType = {}
var arrType = []
var setType = {}
var testType1 = typeof(mapType)
var testType2 = typeof(arrType)
var testType3 = typeof(setType)
console.log(testType1, '引用')
console.log(testType2, '數據')
console.log(testType3, '類型')

//output

object 引用
object 數據
object 類型

</html>

==緣由就是:array object set map 的typeof 都是 object==

---
上面所說的是多層次的拷貝

若是是隻作第一層的拷貝呢:

數組:

1.直接遍歷
2.slice()
slice() 方法返回一個從已有的數組中截取一部分元素片斷組成的新數組（不改變原來的數組！）
3.concat()
concat() 方法用於鏈接兩個或多個數組。( 該方法不會改變現有的數組，而僅僅會返回被鏈接數組的一個副本。)

對象:

1.直接遍歷
2.ES6的Object.assign
Object.assign：用於對象的合併，將源對象（source）的全部可枚舉屬性，複製到目標對象（target），並返回合併後的target

用法： Object.assign(target, source1, source2); 因此 copyObj = Object.assign({}, obj); 這段代碼將會把obj中的一級屬性都拷貝到｛｝中，而後將其返回賦給copyObj
(之前就接觸過,可是沒有徹底瞭解)

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。