js 扩展运算符... 与 Object.assign()是深拷贝还是浅拷贝

374 阅读1分钟

js 扩展运算符... 与 Object.assign()是深拷贝还是浅拷贝

Object.assign

Object.assign() 方法将所有可枚举(Object.propertyIsEnumerable() 返回 true)的自有(Object.hasOwnProperty() 返回 true)属性从一个或多个源对象复制到目标对象,返回修改后的对象。

Object.assign(target, ...sources)

Object.assign() 是把属性值从源对象复制到目标对象。不属于深浅拷贝。目标对象和源对象指向的是不同的地址。

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };
const target1 = { a: 1, b: 2 };
const source1 = { a: 1, b: 2 };

const returnedTarget = Object.assign(target, source);
const returnedTarget1 = Object.assign(target1, source1);

console.log(target); //  Object { a: 1, b: 4, c: 5 }


console.log(returnedTarget === target); //  true
console.log(returnedTarget1 === target1);// true
console.log(source1 === target1);  //  false
console.log(returnedTarget1 === source1); //  false

...扩展运算符

只有第一层是深拷贝,第二层及更深层是浅拷贝

let obj1 = {
    a: 1,
    b: 2
};
obj2 = {...obj1 };

obj2.b = 3;
console.log(obj1.b); // 2
console.log(obj1 === obj2) // false

let obj3 = {
    a: 1,
    b: 2,
    c: {
        d: 4
    }
}

obj4 = {...obj3 };
obj4.c.d = 5;
console.log(obj3.c.d); // 5
console.log(obj3 === obj4); // false
console.log(obj3.c === obj4.c) // true