얕은 복사와 깊은 복사에 대해
복사면 복사지 '얕은 복사'는 뭐고 '깊은 복사'는 뭐람?
처음 얕은 복사와 깊은 복사를 보자마자 한 생각이다.
사실 아직 조금 헷갈리는 부분이 있어 조금 더 공부를 해야할 것 같지만 이해한 것들에 대해서만 이야기 하자면.
얕은 복사: 객체를 복사할 때, 기존 값과 복사된 값이 같은 참조를 가리키고 있는 것을 말한다.
객체 안에 객체가 있을 경우 한 개의 객체라도 기존 변수의 객체를 참조하고 있다면 이를 얕은 복사라고 한다.
깊은 복사: 깊은 복사가된 객체는 객체 안에 객체가 있을 경우에도 원본과의 참조가 완전히 끊어진 객체를 말한다.
이렇게 설명만 보면 전혀 이해가 안된다. 바로 이해를 하는 사람도 있겠지만 나는 아니기 때문에 코드를 직접 확인하며 이해를 해보기로 했다.
📌얕은 복사:
let x = { name: 'robert', age: 25 };
let y = x;
console.log(x);
console.log(y);
y.birth = 1998;
console.log(x);
console.log(y);위 코드의 실행결과는 아래와 같다.
{ name: 'robert', age: 25 }
{ name: 'robert', age: 25 }
{ name: 'robert', age: 25, birth: 1998 }
{ name: 'robert', age: 25, birth: 1998 }이와 같은 결괏값이 도출되는데 내가 이를 이해하기로는
변수를 담은 x라는 상자와 객체 상자가 있을 때 두 상자 사이에 이동할 수 있는 길이 생긴다.
객체 상자로 이동하는 길이 있는 변수 x를 y가 갖게 되며 y 또한 객체 상자로 이동할 수 있는 길을 갖게 된 것이다.
이렇게 되면 x와 y는 서로 같은 객체를 바라보는 길을 갖게 되기 때문에 y만 수정을 했음에도 x에도 같은 값이 들어가게 된다.
이와 같은 경우를 얕은 복사(Shallow copy)라고 한다.
일단 이와 같이 이해했다.
그리고 깊은 복사의 경우는 이와 반대이기 때문에 아예 서로 다른 박스로 분리되어 변수박스와 객체박스가 각각 이동할 수 있는 길을 갖게 되는 것으로 이해했다.
일단 깊은 복사는 Object.assign 라는 메소드로도 가능하나 완전한 깊은 복사는 아니다. 바깥의 객체만 깊은 복사가 될 뿐 내부의 객체는 얕은 복사가 되어 내용을 변경할 수 있는 것이다.
그래서 찾아본 결과 완전한 깊은 복사(Deep copy)를 할 경우
-
재귀함수를 사용한 복사
-
Lodash의 cloneDeep 함수형 라이브러리 사용
-
JSON.parse(), JSON.stringify() 함수 사용
이렇게 세 가지를 사용해야 한다는 나왔다. 깊은 복사에 대한 정의는 어느정도 이해했지만 깊은 복사를 하는 방법에 대해서는 낯선 용어와 함수가 많아서 더 많은 공부가 필요할 것 같다.
완벽히 이해했을 때 이 세가지에 대해 다시 풀이해보기로 했다.
