객체의 얕은 복사와 깊은 복사를 수행하는 방법들
JavaScript에서 객체를 복사하는 방법은 크게 얕은 복사와 깊은 복사로 나뉜다. 얕은 복사는 객체의 프로퍼티를 복사하지만, 중첩된 객체는 참조로 복사된다. 깊은 복사는 객체와 그 하위의 모든 객체를 새로운 객체로 복사한다.
얕은 복사 (Shallow Copy)
1. Spread 문법 ({...})
const originalObject = { key1: 'value1', key2: 'value2' };
const shallowCopy = { ...originalObject };
console.log(shallowCopy); // { key1: 'value1', key2: 'value2' }
2. Object.assign()
const originalObject = { key1: 'value1', key2: 'value2' };
const shallowCopy = Object.assign({}, originalObject);
console.log(shallowCopy); // { key1: 'value1', key2: 'value2' }
깊은 복사 (Deep Copy)
1. JSON.parse()와 JSON.stringify()
const originalObject = { key1: 'value1', key2: { nestedKey: 'nestedValue' } };
const deepCopy = JSON.parse(JSON.stringify(originalObject));
console.log(deepCopy); // { key1: 'value1', key2: { nestedKey: 'nestedValue' } }
하지만 이 방법은 함수나 Symbol 같은 특별한 속성을 복사하지 않는다.
2. lodash 라이브러리 사용
const _ = require('lodash');
const originalObject = { key1: 'value1', key2: { nestedKey: 'nestedValue' } };
const deepCopy = _.cloneDeep(originalObject);
console.log(deepCopy); // { key1: 'value1', key2: { nestedKey: 'nestedValue' } }
lodash의 cloneDeep 함수를 사용하면 좀 더 편리하게 깊은 복사를 할 수 있다.
이전에 관련 포스팅을 했을 때 언급했던 것처럼 얕은 복사와 깊은 복사의 선택은 상황에 따라 다르며, 특히 중첩된 객체가 있을 때 주의해야 한다. 특히 깊은 복사는 중첩된 객체까지 모두 새로운 객체로 만들기 때문에 메모리 소비가 많을 수 있다.