JavaScript深拷贝 浅拷贝

2019-07-15  本文已影响0人  fish_yijinc

JavaScript深拷贝 浅拷贝

JavaScript 数据类型分为两种:

浅拷贝只是复制了对象的引用地址,两个对象指向同一个内存地址,所以修改其中任意的值,另一个值都会随之变化。Array.prototype.slice/concatObject.assign 扩展运算符... 都是浅拷贝

var obj = { a: 1, b: { foo: 'foo' } };
var newObj = {...obj};  // 或 var newObj = Object.assign({}, obj);
newObj.b.foo = 0;
console.log(obj);   // { a: 1, b: { foo: 0 } };

与之对应的就是深拷贝,深拷贝就是指完全的拷贝一个对象,即使嵌套了对象,两者也相互分离,修改一个对象的属性,也不会影响另一个。

JSON.parse( JSON.stringify(obj) ) 可以简单粗暴的作为深拷贝,但不能拷贝函数

自己实现一个深拷贝

var deepCopy = function(obj) {
    if (typeof obj !== 'object') return;
    var newObj = obj instanceof Array ? [] : {};
    for (var key in obj) {
        if (obj.hasOwnProperty(key)) {
            newObj[key] = typeof obj[key] === 'object' ? deepCopy(obj[key]) : obj[key];
        }
    }
    return newObj;
}

一般在开发中会引用第三方工具库,会提供深拷贝方法 如 lodash的_.cloneDeep, jquery的$.extend, immutable的数据转换等

上一篇 下一篇

猜你喜欢

热点阅读