js實現深拷貝和淺拷貝

淺拷貝：有拷貝的功能，可是隻能拷貝一層，是淺拷貝。

1、使用展開運算符（也叫剩餘運算符）...

let obj = {name:'gjf',age:{age:18}};
let newObj = {...obj};
obj.age.age = 25; //修改第二層的obj.age.age,newObj.age.age也會跟着變化
console.log(newObj) // {name:'gjf',age:{age:25}}複製代碼

注意：數據的slice和concat方法也是淺拷貝，只能拷貝一層

深拷貝：你給我什麼，我就返給你一個，返還的這個和你之前的那個是兩個東西。

1、使用JSON.stringify()和JSON.parse()

原理：把一個對象轉化成一個字符串，再把這個字符串轉化成一個對象；

let obj = {name:'gjf',age:{age:18}};
let newObj = JSON.parse(JSON.stringify(obj));
obj.age.age = 25; //修改obj.age.age的值
console.log(newObj) //{name:'gjf',age:{age:18}} //並不影響newObj複製代碼

使用這種方法有一些問題例如：

let obj = {name:'gjf',age:{age:18},a:/\d/,b:function(){},c:undefined};
let newObj = JSON.parse(JSON.stringify(obj));
obj.age.age = 25; //修改obj.age.age的值
console.log(newObj) //{name:'gjf',age:{age:18},a:{}} 會丟失值複製代碼

注意：這種方式轉不了正則、函數、時間和undefined，會丟失值；

2、實現深拷貝

實現深拷貝以前來點面試小知識

//null == undefined true     null === undefined  false
//[] == '' true              [] === ''   false
//雙等是要先進行類型轉化再比較因此是true，三等不進行類型轉化直接比較因此是false複製代碼

深拷貝方法：

// 數字 字符串 function是不須要拷貝的
function deepClone(value) {  
    if (value == null) return value;  
    if (typeof value !== 'object') return value;
    if (value instanceof RegExp) return new RegExp(value);  
    if (value instanceof Date) return new Date(value);  
    // 我要判斷 value 是對象仍是數組 若是是對象 就產生對象 是數組就產生數組  
    let obj = new value.constructor;  
    for(let key in value){    
        obj[key] = deepClone(value[key]); // 看一看當前的值是否是一個對象  
    }  
    return obj;
}複製代碼

好了，咱們的深拷貝方法就這樣完成了，絕對好用！！！