ES6 Object.assign()解析

es6出的這個Object.assign()在大部分的場景當中都會使用,比方說寫redux中reducer的純函數(shù)、或者在提交之前處理提交的數(shù)據(jù)之類的。
但它有一個問題,它是淺拷貝,因為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

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容