Javascript

객체의 얕은 복사와 깊은 복사를 수행하는 방법들

John' 2023. 11. 23. 19:25

인간은 망각의 동물이다. 특정한 행동이나 생각을 자주 하지 않으면 우리 뇌 속에서는 신경의 가지치기 현상이 일어난다고 한다. 우리가 어떤 생각, 기분, 행동을 수행하지 않으면 뇌는 그와 연관된 뉴런들을 발화시키지 않는데, 그 결과 그러한 생각, 기분, 행동이 점점 약해지다가 결국 시들어버리고 잊게 되는 것을 신경 가지치기라고 한다. 그렇기 때문에 우리는 초등학교 시절처럼 리코더를 연주할 수 없는거고, 곡면의 부피를 구하는 적분 공식이나 근의 공식등에 대해 더는 기억하지 못하는 것이다. 쉽건, 어렵건 지금 나는 무조건 많이 생각하고 자꾸 써보고 사용해보는 것 밖에 방도가 없다 생각한다.

 

 

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 함수를 사용하면 좀 더 편리하게 깊은 복사를 할 수 있다.

이전에 관련 포스팅을 했을 때 언급했던 것처럼 얕은 복사와 깊은 복사의 선택은 상황에 따라 다르며, 특히 중첩된 객체가 있을 때 주의해야 한다. 특히 깊은 복사는 중첩된 객체까지 모두 새로운 객체로 만들기 때문에 메모리 소비가 많을 수 있다.