JS中的浅克隆与深克隆

使用场景:

      在实际项目运用的过程中我们希望数据引入后修改数据不会影响到源数据, 避免数据污染, 所以这里使用数据克隆来避免数据污染（当然克隆的方法有很多种，这里主要强调集中比较常见的克隆方式）

    在JS中的克隆对于不同的数据类型有不同的定义

    基本类型  =>   对于JS中的基本类型来说没有浅克隆, 都是直接赋值的操作(也可以理解为深克隆)

    引用类型  =>   对于JS中的引用类型(复杂的数据类型)分为

浅克隆  =>   指向相同的同一块内存区域(并没有开辟新的内存空间)

   实现方式

let a = {name: 'cat'}
let b = a  // 1.简单的赋值

     深克隆  =>  源数据与克隆出来的数据不会互相影响

1. 通过JSOP转换实现克隆(对Date、函数对象、NaN解析可能会有问题)

let a = { name: 'cat' }
let b = JSON.parse(JSON.stringify(a));


// 这样确实可以方便的实现克隆, 但是对于通过JSON的方式来进行转换有以下几种缺点
1. 转换数据中的引用类型时 会丢失对象本身的constructor(无法追溯上层对象)
2. 转换NAN时会自动忽略
3. 转换事件对象时会转换成为字符串而不是时间对象

     2. 使用递归循环

        循环判断当前对象的每一项并，判断当前项的值是否为对象，如果是对象的话，则递归查询调用方法，进行深克隆

// 用于检测传入数据是否是数组
export const isArray = (arr) => {
    return arr instanceof Array
}

// 用于检查当前key在不在这个对象上面
export const isProperty = (obj, key) => {
    return Object.prototype.hasOwnProperty.call(obj, key)
}

export const deepClone = (obj) => {
// 首先检查传入的类型是数组还是对象
    const objClone = isArray(obj) ? [] : {}
// 当已传入变量并且类型为object时执行下一步操作
    if (obj && obj instanceof === 'object') {
        for (const key in obj) {
// 检查当前key是否在当前对象上面
            if (isPrpoerty(obj, key)) {
// 如果当前类型为引用类型的时候就进行递归克隆
// 基本类型就是简单的赋值
                if (obj[key] && obj[key] instanceof === 'object') {
                    objClone[key] = deepClone(obj[key])
                } else {
                    objClone[key] = obj[key]
                }
            }
        }
    }
    return objClone
}