[JavaScript] Object.assign() - 서로 다른 객체 병합하기/합치기

앞서 스크립트에서의 서로다른 문자열 또는 배열을 합치는 방법에 대해 알아봤는데

이번에는 서로 다른 객체를 병합하는 방법에 대해 알아보고자 한다.

 

▷ 구문

Object.assign(target, ...sources)

target: 기준이 될 객체를 의미한다.

sources : 기준이 될 객체에 합치려는 객체들을 의미한다.

---

이제 예제를 통해 알아보도록 하자.

 

▷ 예제1) 기존의 객체 변수에 병합하기

var mine = {a : 0 , b : 1};
var it = {b : 3, c : 7};

Object.assign(mine, it);
// mine = {a: 0, b: 3, c: 7}

 

위 구문에서 target 과 sources로 나뉘어 있다고 명시해 뒀는데, 예제와 마찬가지로 target이 되는 mine 객체에 it 객체가 병합되었다. 

 

이 병합되는 과정에서 당연히 key / value 로 이루어진 객체 특성상 같은 key값을 가지고 있다면 나중에 들어온 key 값으로 덮어쓰여진다. 즉, 앞의 출처 속성들은 뒤의 출처 속성들에게 덮어쓰여진다는 말이다.

 

기존 객체의 값은 건드리지 않고 병합된 새로운 객체를 만들려면 어떻게 해야할까? 예제2)를 통해 알아보자.

 

▷ 예제2) 기존 객체를 덮어쓰지 않고 병합된 새로운 객체 만들기

var mine = {a : 0 , b : 1};
var it = {b : 3, c : 7};

var record = Object.assign({}, mine, it);
// mine = {a : 0 , b : 1};
// it = {b : 3, c : 7};
// record = {a: 0, b: 3, c: 7}

 

기존 객체는 건드리지 않고 병합된 새로운 객체를 만드는 방법은 target 매개변수에 빈 객체를 넣어주기만 하면 된다.

기준은 target 변수로 쓰여진 객체이기 때문에 빈 객체를 넣어두고 변수로 받아주기만 하면 병합에 사용된 객체들은 변하지 않고 병합된 결과를 가진 새로운 객체를 얻을 수 있다.

 

 

참고 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

Object.assign() - JavaScript | MDN