[TypeScript] 깊은 복사와 얕은 복사 - 배열 복사 원본 유지

다음은 깊은 복사의 예입니다.

let original = 1;
let copied = original;
copied += 4;

console.log(original);	// 1
console.log(copied);	// 5

일반 변수는 다음과 같이 복사하는 경우 값만 복사가 되어 원본은 값은 유지가 됩니다.

즉, 원본과 복사본은 별개의 변수입니다.

 

 

다음은 얕은 복사의 예입니다.

let originalArray = [1, 2, 3, 4, 5];
let copiedArray = originalArray;

copiedArray[0] = 0;
console.log(originalArray); // [ 0, 2, 3, 4, 5 ]
console.log(copiedArray);	// [ 0, 2, 3, 4, 5 ]

originalArray[1] = 7;
console.log(originalArray);	// [ 0, 7, 3, 4, 5 ]
console.log(copiedArray);	// [ 0, 7, 3, 4, 5 ]

하지만, 객체 혹은 배열은 값을 복사하는 경우 값만 복사되는 것이 아닌 원본의 데이터가 저장되어있는 메모리를 참조하게 됩니다.

즉, 원본의 값을 변경하여도 복사본의 값이 변경되고 복사본의 값을 변경하여도 워본의 값이 변경됩니다.

주의할점은 전개 연산자(Spread Operator)인 경우에는 깊은 복사를 지원합니다.

let originalArray = [1, 2, 3, 4, 5];
let copiedArray = [...originalArray];
copiedArray[0] = 0;
console.log(originalArray); // [ 1, 2, 3, 4, 5 ]
console.log(copiedArray);   // [ 0, 2, 3, 4, 5 ]

originalArray[1] = 7;
console.log(originalArray); // [ 1, 7, 3, 4, 5 ]
console.log(copiedArray);   // [ 0, 2, 3, 4, 5 ]