얕은 복사 vs 깊은 복사

목차
1. 얕은 복사
2. 깊은 복사
3. 뭐가 더 좋을까?

1. 얕은 복사

• 하나의 데이터에 대한 주소를 다른 변수가 공유하는 형태

참조타입의 데이터를 다룰 때 변수에 할당된 데이터의 주소를 통해 값을 가져오거나 변경을 한다. 그런데 때에 따라 같은 값의 데이터를 다룰때 또 다른 변수를 하나 생성하여 같은 주소를 할당하는 것이 얕은 복사다. 주로 단순 데이터 전달데이터 전달하는 것과 같이 원본이 수정되더라도 상관없을 때 사용된다.

예제를 통해 얕은 복사를 확인해보자.

const arr1 = [1,2,3];
const arr2 = arr1;

console.log(arr1); //1,2,3
console.log(arr2); //1,2,3

arr2.push(4);

console.log(arr1); //1,2,3,4
console.log(arr2); //1,2,3,4

arr1이라는 배열 하나를 생성하고 arr2를 생성하여 배열을 할당했다. 그 후 arr2에 값을 하나 추가했는데 arr1은 1,2,3을 갖고 arr2는 1,2,3,4를 갖고 있을 것 같지만 arr2는 arr1의 배열 데이터의 주소를 공유하고 있으므로 두개의 변수는 1,2,3,4를 갖는 배열의 출력한다.

2. 깊은 복사

• 새로운 메모리 공간에 같은 데이터를 할당하는 형태

깊은 복사는 다른 값을 복사하지만 새로운 메모리 공간을 받아 그 메모리 주소를 통해 값을 할당한다. 따라서 실제로는 값만 같지 주소가 달라 서로 다르다고 할 수 있다. 상태를 관리하거나 객체의 데이터가 자주 바뀌는 경우 사용하는 것이 좋다.

예제를 통해 깊은 복사를 확인해보자.

 const arr1 = [1, 2, 3];
 const arr2 = JSON.parse(JSON.stringify(arr));
 
 console.log(arr1)//1,2,3
 console.log(arr2)//1,2,3

 arr2.push(4)
 
 console.log(arr1)//1,2,3
 console.log(arr2)//1,2,3,4

arr2를 선언할 때 JSON을 통해 문자열로 변환했다가 객체로 만드는 방식으로 새로운 메모리에 복사하는 방법을 사용하여 arr2에 새로운 값을 추가해도 arr1은 변하지 않는다. 이 외에도 깊은 복사를 가능하게 하는 여러 메소드가 있기때무네 그러한 방법들을 사용해도 된다.

3. 뭐가 더 좋을까?

사실 무엇이 더 좋고 안좋은 건 없다. 얕은 복사는 원본 데이터가 훼손되면 돌이키지 못한다는 단점이 있지만 메모리를 추가적으로 사용하지않는다. 하지만 깊은 복사는 원본 데이터가 유지되어 신뢰성은 높을 수 있지만 메모리 공간이 추가적으로 필요하기 때문에 메모리 관리 부분에서는 효율적이지 못할 수 있다.

따라서 경우에 따라 구분하여 사용하는 것이 좋다.