浅拷贝与深拷贝

浅拷贝

定义

浅拷贝是按位拷贝对象,它会创建一个新对象,这个对象有着原始对象属性值的一份精确拷贝。 如果属性是基本类型,拷贝的就是基本类型的值;如果属性是内存地址(引用类型),拷贝的就是内存地址,因此如果其中一个对象改变了这个地址,就会影响到另一个对象。

Object.assign方法实行的是浅拷贝,而不是深拷贝。也就是说,如果源对象某个属性的值是对象,那么目标对象拷贝得到的是这个对象的引用。

    const info={name:"why"} //属性的value是值,所以只是复制值
    const obj=Object.assign({},info)
    obj.name="he"
    console.log(info)

    const obj1 = {a: {b: 1}}//属性的value是对象,复制的是引用
    const obj2 = Object.assign({}, obj1)

    obj1.a.b = 2
    obj2.a.b // 2
    console.log(obj2)

输出结果

{ name: 'why' }
{ a: { b: 2 } }

这里也可以用es6语法展开运算符进行浅拷贝


    const obj1 = {a: {b: 1}}//属性的value是对象
    const obj2 = {...obj1}

    obj1.a.b = 2
    obj2.a.b // 2
    console.log(obj2.a===obj1.a)

比较一下,结果为true,对象确实是同一个

深拷贝

深拷贝会另外创造一个一模一样的对象,新对象跟原对象不共享内存,修改新对象不会改到原对象

利用lodash库实现深拷贝

Lodash 是一个一致性、模块化、高性能的 JavaScript 实用工具库

const _ = require('lodash');
const obj1 = {
    a: 1,
    b: {f: {g: 1}},
    c: [1, 2, 3]
};
const obj2 = _.cloneDeep(obj1);

console.log(obj1.b.f === obj2.b.f);

结果是false,深拷贝不是同一个对象

发表评论