Object.assign() 메서드는 출처 객체들의 속성을 복사해 대상 객체에 붙여넣어 반환한다.
const target = { a: 1, b: 2 }; const source = { b: 4, c: 5 }; const returnedTarget = Object.assign(target, source); console.log(returnedTarget); // Object { a: 1, b: 4, c: 5 }
returnedTarget 변수에 할당된 객체는 source 객체의 속성이 target 객체에 복사된 객체이다.
console.log(target); // Object { a: 1, b: 4, c: 5 }
이때 Object.assign()
의 첫번째 인자로 전달된 target 객체 또한 속성이 변경된다.
target
목표 객체. 출처 객체의 속성을 복사해 반영한 후 반환할 객체
sources
출처 객체. 목표 객체에 반영하고자 하는 속성들을 갖고 있는 객체들
const obj = { a: 1 }; const copy = Object.assign({}, obj); console.log(copy); // { a: 1 } copy.a = 2; console.log(copy) // { a: 2 } console.log(obj); // { a: 1 }
Object.assign()
의 첫번째 인자에 빈 객체를 전달해서 copy에 할당하였다.
이렇게 복제된 copy 객체는 속성을 변경해도 obj 객체에 적용되지 않는다.
let obj1 = { a: 0 , b: { c: 0}}; let obj2 = Object.assign({}, obj1); // JSON.stringify() 메서드는 JavaScript 값이나 객체를 JSON 문자열로 변환한다. console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}} obj2.a = 2; console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}} console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 0}} // obj2.b.c = 3; console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 3}} console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 3}}
위의 예시에서 obj2 객체는 obj1의 속성이 복제되었다.
Object.assign()
의 첫번째 인자에 빈 객체를 전달했고 다음 인자에 obj1을 전달했기 때문에 obj1이 복사된 새로운 객체가 obj2에 할당되었다.
그런데 obj2.b.c = 3; 에서 obj1의 속성 또한 변경되었다.
이는 Object.assign()
으로 객체를 복사할 때 속성이 참조 자료형일 경우 참조 값인 주소가 복사되기 때문이다.