자바스크립트에서 데이터를 다루는 방식은 크게 원시 값(Primitive Values)과 참조 값(Reference Values)으로 나뉩니다. 이 두 방식의 차이를 이해하는 것은 효율적인 메모리 관리와 예상치 못한 버그를 방지하는 데 필수적입니다.
1. 데이터 저장 방식과 메모리 구조
자바스크립트는 데이터의 타입에 따라 메모리 공간을 다르게 할당합니다.
- 원시 값: String, Number, Boolean, null, undefined, Symbol, BigInt가 해당됩니다. 이들은 스택(Stack) 메모리에 고정된 크기로 저장되며, 변수는 실제 값을 직접 보유합니다.
- 참조 값: Object, Array, Function 등 원시 타입을 제외한 모든 것은 객체입니다. 실제 데이터는 힙(Heap) 메모리에 저장되고, 변수에는 해당 메모리의 주소를 가리키는 포인터(Pointer)가 저장됩니다.
2. 변수 복사 시의 동작 차이
데이터를 다른 변수에 할당할 때, 원시 값은 값을 복제하고 참조 값은 주소를 공유합니다.
원시 값의 복사: 독립적인 값 생성
원시 값을 복사하면 값이 완전히 복제되어 서로 다른 메모리 공간을 차지하게 됩니다.
let scoreA = 100;
let scoreB = scoreA; // 값이 복사됨
scoreA = 200;
console.log(scoreB); // 결과: 100 (scoreA의 변경이 scoreB에 영향을 주지 않음)
참조 값의 복사: 메모리 주소 공유
참조 값을 할당하면 실제 객체가 아닌 힙 메모리의 주소값이 복사됩니다. 즉, 두 변수가 동일한 객체를 바라보게 됩니다.
const member1 = { grade: "Gold" };
const member2 = member1; // 주소가 복사됨
member1.grade = "VIP";
console.log(member2.grade); // 결과: "VIP" (동일한 객체를 참조하므로 함께 변경됨)
3. 동적 속성 추가 능력
참조 값은 실행 중에 속성을 자유롭게 추가하거나 삭제할 수 있지만, 원시 값은 이것이 불가능합니다.
// 참조 값의 경우
let settings = {};
settings.theme = "dark"; // 속성 추가 가능
delete settings.theme; // 속성 삭제 가능
// 원시 값의 경우
let message = "Hello";
message.id = 123; // 에러는 발생하지 않지만 무시됨
console.log(message.id); // undefined
4. 데이터 타입 판별: typeof와 instanceof
원시 값과 참조 값을 식별하기 위해 자바스크립트는 두 가지 주요 연산자를 제공합니다.
- typeof: 원시 타입(문자열, 숫자 등)을 확인하는 데 유용합니다. 다만,
null은"object"를 반환하고, 함수는"function"을 반환하는 특성이 있습니다. - instanceof: 객체가 특정 클래스나 생성자의 인스턴스인지 확인할 때 사용합니다. 참조 타입의 구체적인 종류를 파악할 때 적합합니다.
5. 원시 래퍼 객체(Primitive Wrapper Objects)의 이해
원시 값은 객체가 아님에도 불구하고 메소드를 호출할 수 있습니다. 이는 자바스크립트 엔진이 내부적으로 '래퍼 객체'를 일시적으로 생성하기 때문입니다.
let email = "user@example.com";
let domain = email.substring(5); // 내부적으로 new String(email)이 생성되었다가 소멸됨
원시 값과 래퍼 객체의 논리적 차이
생성자를 통해 강제로 객체를 만들 경우, 논리 연산에서 혼동을 야기할 수 있습니다.
let rawFalse = false;
let objectFalse = new Boolean(false);
console.log(rawFalse && true); // false
console.log(objectFalse && true); // true (객체는 항상 참으로 평가됨)
6. 요약 및 비교
| 특성 | 원시 값 (Primitive) | 참조 값 (Reference) |
|---|---|---|
| 저장 위치 | 스택 (Stack) | 힙 (Heap) |
| 복사 방식 | 값 자체를 복사 | 참조(주소)를 복사 |
| 동적 속성 | 불가능 | 가능 |
| 주요 판별법 | typeof | instanceof |
원시 값은 불변성(Immutability)을 가지며 단순한 데이터를 저장하는 데 효율적입니다. 반면, 참조 값은 복잡한 데이터 구조를 형성하고 메모리 효율을 위해 주소를 공유하는 방식을 취합니다. 이러한 특성을 명확히 구분하여 사용하는 것이 자바스크립트 프로그래밍의 핵심입니다.