深拷贝与浅拷贝

浅拷贝

• 浅拷贝是指创建一个新的数据 这个数据有原始属性值得拷贝
• 基本类型 拷贝的就是基本类型得值
• 引用类型 拷贝的是内存地址

    // 实现一个简单的浅拷贝
    let clone = (obj) => {
        let newObj = {}
        for(let prop in obj) {
            if(obj.hasOwnProperty(prop)){
                newObj[prop] = obj[prop]
            }
        }
        return newObj
    }

• 存在浅拷贝现象的有
• Object.assign
• 用于将所有可枚举属性的值从一个或多个源对象分配到目标对象。它将返回目标对象

    let obj = {
        a:1
        b:2
    }

    let objs = Object.assign({}, obj) // {a:1,b:2}

• slice
• 返回一个新的数组对象，这一对象是一个由 begin 和 end 决定的原数组的浅拷贝

    let arr = [1,2,3]
    let arr1 = arr.slice(0) // [1,2,3]
    arr1[0] = 6
    arr  // [6,2,3]
    arr1 // [1,2,3]

• concat
• 用于合并多个数组 返回一个新数组 不会改变原数组

    let arr = [1,2,3]
    let arr1 = arr.concat() // [1,2,3]
    arr1[0] = 6
    arr1 //[6,2,3]
    arr  //[1,2,3]

• 扩展运算符 ...

    let arr = [1,2,3]
    let arr1 = [...arr]
    arr1[0] = 6
    arr1 // [6,2,3]
    arr  //[1,2,3]

深拷贝

• 深拷贝开辟一个新的栈 对应两个不同地址
• 常见深拷贝
• _.cloneDeep()

    let _ = require('lodash')
    let obj = {
        a:1
        b:{c:1}
    }
    let obj2 = _.cloneDeep(obj)
    console.log(obj.b.c == obj1.b.c)  // false

• JSON.stringify
• 将一个 JavaScript 对象或值转换为 JSON 字符串
• 会忽略 undefined symbol 和 函数

let obj = {a:1}
let obj1 = JSON.stringify(obj) // '{"a":1}'

手写一个深拷贝

let cloneDeep = (obj,hash = new WeakMap()) => {
    // 如果obj是null或者undefined 不进行拷贝操作直接返回
    if(obj === null) return obj
    // 如果obj是在某个实例对象的原型上 直接返回处理后的obj
    if(obj instanceof Date) return new Date(obj)
    if(obj instanceof RegExp) return new RegExp(obj)
    // 如果是函数不需要深拷贝
    if(typeof obj !== "object" ) return obj
    // 对象进行深拷贝  返回  WeakMap 指定的元素
    if(hash.get(obj)) return hash.get(obj)
    let cloneObj = new obj.constructor()
    // 找到所属类原型上的constructor
    hash.set(obj,cloneObj)
    for (let key in obj) {
        if(obj.hasOwnProperty(key)){
            // 实现一个递归拷贝
            cloneObj[key] = cloneDeep(obj[key],hash)
        }
    }
        return cloneObj
}

总结

• 今日份小知识get~