深克隆浅克隆

浅克隆

展开运算符

let arr1 = [10,20,{name:'zll'}];
let arr2 = [...arr1]
arr1[2] === arr2[2] // true

slice

let arr1 = [10,20,{name:'zll'}];
let arr2 = arr1.slice(0)
arr1[2] === arr2[2] // true

Object.assign

let obj1 = {a:{b:{c:1}}}
let obj2 = Object.assign({},obj1)
obj1.a===obj2.a//true
obj1.a.b===obj2.a.b//true

深克隆

JSON

• 如果出现以下内容将会出现问题
  • 正则 => 空对象
  • function => null
  • Date对象 => 日期字符串

let arr1 = [10,20,{name:'zll'}];
let arr2 = JSON.parse(JSON.stringify(arr1))
arr1[2] === arr2[2] // false

let arr1 = [10,20,/\.css$/];
let arr2 = JSON.parse(JSON.stringify(arr1))
console.log(arr2);//[10,20,{}]

let arr1 = [10,20,function(){}];
let arr2 = JSON.parse(JSON.stringify(arr1))
console.log(arr2);//[10,20,null]

deepClone方法

• 支持自定义类实例化出来的对象的深克隆

function deepClone(obj) {
    if(obj === 'null') return null;
    if(typeof obj !== 'object') return obj;
    if(Object.prototype.toString.call(obj) === '[object RegExp]') return new RegExp(obj);
    if(Object.prototype.toString.call(obj) === '[object Date]') return new Date(obj);
    // 如果还有其他特殊情况，在此继续添加
    
    let newObj = new obj.constructor;
    for(let key in obj) {
        if(!obj.hasOwnProperty(key)) break;
        newObj[key] = deepClone(obj[key]);
    }
    return newObj;
}