两种方法实现JavaScript深拷贝

1、利用JSON

let obj1 = {
    name: 'mys',
    age: 18
}
let str = JSON.stringify(obj1) // 将对象转换成json格式
let obj2 = JSON.parse(str) // 将json格式的数据转换成对象
obj1.age = 20 // obj1改变，obj2不会改变，obj1 obj2是两个独立的对象
console.log(obj2) // {name: 'mys', age: 18}

2、自写一个deepClone()方法

// 1.利用toString()方法检查类型
let checkType = data => {
    //slice(8, -1)：如果是对象或数组类型，直接获取的结果中有[]{},需要去除
    //eg.[object String]:从第8位开始截取，-1代表截取到倒数第一位(不包含)，正好截取到需要的String
    return Object.prototype.toString.call(data).slice(8, -1)
}

// 2.深拷贝
let deepClone = target => {
    let targetType = checkType(target) // 检查当前数据的类型
    let res // 返回值
    if (targetType === 'Object') {
        //当前数据是Object类型，返回空对象
        res = {}
    } else if (targetType === 'Array') {
        //当前数据是Array类型，返回空数组
        res = []
    } else {
        //当前数据既不是对象，也不是数组，就是基本数据类型，直接返回
        return target
    }

    for(let i in target) {
        let value = target[i]
        let valueType = checkType(value) // 再次检查value的数据类型，如果是对象或数组，需要再处理
        // 如果获取到的value也是对象或数组类型，需要递归进行拷贝
        if (valueType === 'Object' || valueType === 'Array') {
            res[i] = deepClone(value)
        } else {
            // 如果是基本数据类型，直接赋值即可
            res[i] = value
        }
    }
    return res
}

// 测试
let obj1 = {
    name: 'mys',
    hobby: ['coding', 'eating']
}
let obj2 = deepClone(obj1)
obj2.hobby[0] = 'sleeping'
console.log(obj1) // hobby: ['coding', 'eating']
console.log(obj2) // hobby: ['sleeping', 'eating']