얕은 복사를 수행하면, 원본 객체의 최상위 수준에는 원본과 복사본이 각각 존재하지만, 내부에 포함된 객체는 복사되지 않고 그 참조가 공유된다.
그러므로 내부 객체의 변경은 복사본과 원본에 모두 영향을 끼친다.
// 원본 객체
const originObject = {
name: '김현중',
age: 25,
property : ['student', 'beggar']
};
// 얕은 복사
const shallowCopy = Object.assign({}, originalObject);
// 복사본에서 나이를 변경
shallowCopy.age = 26
console.log(originObject); // {name: '김현중', age: 26, property : ['student', 'beggar']}
console.log(shallowCopy); // {name: '김현중', age: 26, property : ['student', 'beggar']}
이렇게 얕은 복사는 값 자체가 아닌 주소를 복사해서 같은 메모리를 차지하고 있기 때문에, 복사본만 수정해도 원본도 바뀐다.
얕은 복사를 사용하는 이유는, 객체 각각의 속성을 메모리에 할당할 때 걸리는 시간이 존재하는데, 얕은 복사는 주소값(참조값)만을 복사하기 때문에 메모리 사용량이 적어진다는 장점이 있다.
깊은 복사는 내부에 포함된 객체나 데이터까지 전부 복사하여 새로운 복사본을 생성하고, 독립적인 구조를 가져서 새로운 메모리 공간을 할당한다.
따라서 깊은 복사는 그냥 객체나 데이터를 통째로 복사해서 독립적인 개체를 생성하는 것이다.
const originObject = {
name: '김현중',
age: 25,
property : ['student', 'beggar']
};
// 깊은 복사
const deepCopy = JSON.parse(JSON.stringify(originalObject));
// 복사본에서 나이를 변경
deepCopy.age = 26
console.log(originObject); // {name: '김현중', age: 25, property : ['student', 'beggar']}
console.log(deepCopy); // {name: '김현중', age: 26, property : ['student', 'beggar']}
이렇게 깊은 복사는 독립적인 개체를 생성하므로, 복사본을 변경해도 원본 객체에 영향을 끼치지 않는다.
깊은 복사를 사용하는 이유는, 원본 객체의 값만 복사본으로 가져와 별도로 활용하고, 복사본을 수정해도 원본의 값이 변하지 않게 하려고 사용한다.
