[JavaScript] 데이터 복사 이해하기 (feat. 얕은 복사, 깊은 복사)

2025년 12월 1일에 작성된 글입니다. 객체를 복사했는데 원본까지 바뀌는 경험 있으신가요? JavaScript에서는 데이터를 복사할 때 타입에 따라 동작 방식이 다르기 때문에 이런 일이 발생합니다. 이 글에서는 복사의 기본 원리부터 실전 복사 전략까지 단계별로 알아보겠습니다. 이 글을 통해 얻을 수 있는 것 데이터 타입에 따른 복사 방식의 차이를 이해한다 객체 복사 시 주의해야 할 점을 안다 상황에 맞는 복사 방법을 선택할 수 있다 1. JavaScript 데이터의 복사: 타입에 따라 다르다 JavaScript의 타입은 크게 원시 값과 객체로 나뉩니다. 또한 변수에 값을 할당하거나 복사할 때, 값의 타입이 무엇인지에 따라 동작이 다릅니다. JavaScript의 타입을 잘 모르겠다면 MDN 자료를 참고해보세요. 원시 값 (Primitive Values) 원시 값은 변수에 ‘값 자체’가 저장됩니다. 종류: string, number, bigint, boolean, undefined, symbol, null 가 있습니다. 복사 시 완전히 독립된 새로운 값이 생성됩니다. let a = 100; let b = a; // a의 값(100)이 복사되어 b에 저장 b = 50; // b만 변경됨 console.log(a); // 100 console.log(b); // 50 (서로 독립적임) 객체 (Object) 객체는 변수에 값이 아닌 ‘메모리 주소(참조)’가 저장됩니다. 종류: object, array가 있으며, function, Date 또한 객체의 일종입니다. 복사 시 객체를 가리키는 주소가 복사됩니다. let myArr = []; let copyArr = myArr; // 배열을 가리키는 주소가 복사됨 copyArr.push("hello"); // 복사본을 수정 console.log(copyArr); // ["hello"] console.log(myArr); // ["hello"] (원본도 변경됨) 2. 객체 복사 시 주의점: 참조 공유 문제 const a =