ES6 Object.assign()解析

es6出的这个Object.assign()在大部分的场景当中都会使用,比方说写redux中reducer的纯函数、或者在提交之前处理提交的数据之类的。
但它有一个问题,它是浅拷贝,因为Object.assign()拷贝的是对象的属性值,如果属性值是一个对象的引用,那么它拷贝的就是那个对象的引用值。

let obj = {
    a: 1,
    b: 2,
    c: {
        a: 111
    }
}
let newObj = Object.assign({}, obj)
console.log(obj) //{ a: 1, b: 2, c: { a: 111 } }
console.log(newObj) //{ a: 1, b: 2, c: { a: 111 } }
obj.a = 222
console.log(obj) //{ a: 222, b: 2, c: { a: 111 } }
console.log(newObj) //{ a: 1, b: 2, c: { a: 111 } }
obj.c.a = 1
console.log(obj) //{ a: 222, b: 2, c: { a: 1 } }
console.log(newObj) //{ a: 1, b: 2, c: { a: 1 } }

很明显能看出来,属性为一个对象的索引,就会导致拷贝的值一起变化,因为他们的地址是一样的。

那么只能自己来写一个,既然说到了es6,那就用es6写一个:

const deepClone = obj => {
    if (!obj || typeof obj !== 'object') {
        return obj
    }
    let o = {}
    if (Array.isArray(obj)) {
        o = obj.map(item => deepClone(item))
    } else {
        Object.keys(obj).forEach((key) => {
                    return o[key] = deepClone(obj[key])
            })
    }
    return o
}

这种比JSON.parse(JSON.stringify())要更加通用。
支持null、undefined、NaN、Infinity

你可能感兴趣的:(ES6 Object.assign()解析)