深拷贝详细解析

JSON.parse(JSON.stringify())

循环引用会报错， 不能拷贝函数

 function deepClone1(target) {
    const result = JSON.parse(JSON.stringify(target))
    return result
}

 const obj = {
     a: 1,
     b: ['e', 'f', 'g'],
     c: {h: 20},
     d: function() {}
 }
 // 循环引用
 obj.b.push(obj.c)
 obj.c.j = obj.b
 // 不能拷贝函数
 const result = deepClone1(obj)
 console.log(obj)
 console.log(result)

究极解决方案：

function deepClone2(target, map = new Map()) {
    if(typeof target === 'object' && target !== null) {
        // 克隆数据之前，进行判断，数据之前是否客隆过
        let cache = map.get(target)
        if(cache) {
            return cache
        }
        // 判断目标数据的类型
        let isArray = Array.isArray(target)
        // 创建一个容器
        const result = Array.isArray(target) ? [] : {}
        map.set(target, result)
        // 如果目标为数组
        if(isArray) {
            target.forEach((item, index) => {
                result[index] = deepClone2(item, map)
            })
        } else {
            Object.keys(target).forEach(key => {
                result[key] = deepClone2(target[key], map)
            })
        }
        return result
    } else {
        return target
    }
}

 const obj = {
     a: 1,
     b: ['e', 'f', 'g'],
     c: {h: 20},
     d: function() {}
 }
 // 循环引用
 obj.b.push(obj.c)
 obj.c.j = obj.b
 const result = deepClone2(obj)
 console.log(obj)
 console.log(result)