자바스크립트 기본 문법 - 데이터 타입 - 0 - 참조 타입과 값 타입

Table of Contents

자바스크립트 기본 문법 – 데이터 타입 – 0 – 참조 타입과 값 타입

소제목: 데이터 타입의 개념

데이터 타입은 프로그래밍 언어에서 사용되는 값의 종류를 의미합니다. 자바스크립트에서는 여러 가지 데이터 타입이 있으며, 이 중에서도 “참조 타입”과 “값 타입”에 대해 알아보겠습니다.

참조 타입과 값 타입의 개념

값 타입(Value Type)은 변수에 직접적으로 값을 할당하는 데이터 타입입니다. 값을 할당할 때 해당 변수에는 실제 값이 저장됩니다. 예를 들어, 숫자, 문자열, 논리값 등은 값 타입에 해당합니다. 값 타입 변수는 메모리의 스택(Stack) 영역에 저장됩니다.

참조 타입(Reference Type)은 변수에 값이 아니라 값이 저장된 메모리 주소(참조)를 할당하는 데이터 타입입니다. 참조 타입 변수는 실제 값이 저장된 메모리 공간을 가리키는 포인터로 동작합니다. 예를 들어, 객체, 배열, 함수 등은 참조 타입에 해당합니다. 참조 타입 변수는 메모리의 힙(Heap) 영역에 저장됩니다.

소제목: 값 타입의 예시

값 타입은 변수에 실제 값을 저장하므로 변수 간에 값을 복사할 때는 각각의 독립적인 값을 가지게 됩니다. 이해를 돕기 위해 아래 예시를 살펴봅시다.

let a = 5;
let b = a;

b = 10;

console.log(a); // 출력 결과: 5
console.log(b); // 출력 결과: 10

위의 코드에서 변수 a에는 값 5가 할당되고, 변수 b에는 변수 a의 값을 복사하여 할당합니다. 그 후 변수 b의 값을 10으로 변경합니다. 이후 출력된 결과를 보면 변수 a의 값은 변경되지 않았고, 변수 b만 10으로 변경된 것을 확인할 수 있습니다. 이는 값 타입이 각 변수에 독립적인 값을 저장하기 때문입니다.

소제목: 참조 타입의 예시

참조 타입은 변수에 메모리 주소를 할당하므로 변수 간에는 같은 메모리 주소를 가리키게 됩니다. 이해를 돕기 위해 아래 예시를 살펴봅시다.

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

arr2.push(4);

console.log(arr1); // 출력 결과: [1, 2, 3, 4]
console.log(arr2); // 출력 결과: [1, 2, 3, 4]

위의 코드에서 변수 arr1에는 배열 [1, 2, 3]이 할당되고, 변수 arr2에는 변수 arr1의 값을 할당합니다. 그 후 변수 arr2로 배열에 4를 추가합니다. 이후 출력된 결과를 보면 변수 arr1과 arr2가 모두 [1, 2, 3, 4]로 동일한 배열을 가리키고 있는 것을 확인할 수 있습니다. 이는 참조 타입이 동일한 메모리 주소를 가리키기 때문입니다.

소제목: 비유를 통한 이해

값 타입과 참조 타입을 비유를 통해 이해해보겠습니다. 값 타입은 비유로서 사과를 생각해볼 수 있습니다. 예를 들어, 여러 개의 사과를 각각의 상자에 담아 보관하는 것과 같습니다. 한 상자에 사과를 추가하거나 제거해도 다른 상자의 사과는 영향을 받지 않습니다. 각 상자는 독립적으로 사과를 보유하고 있기 때문입니다.

반면에 참조 타입은 비유로서 주소를 생각해볼 수 있습니다. 예를 들어, 여러 명의 사람이 같은 주소를 가리키고 있는 집에 살고 있다고 상상해봅시다. 한 사람이 집에 가서 집 안을 변경하면 다른 사람들도 그 변경사항을 공유하게 됩니다. 모두가 같은 주소를 참조하고 있기 때문에 하나의 변경이 모두에게 영향을 미치는 것입니다.

소제목: 주의해야 할 점

참조 타입과 값 타입을 이해하는 데 있어서 주의해야 할 몇 가지 점이 있습니다.

값 타입은 복사, 참조 타입은 참조:
- 값 타입은 변수 간에 값을 복사하여 독립적으로 사용할 수 있습니다.
- 참조 타입은 변수 간에 메모리 주소를 공유하여 같은 객체를 참조하게 됩니다.
값 타입은 메모리 사용량이 크지 않음:
- 값 타입은 변수 자체가 값을 가지므로 메모리 사용량이 비교적 작습니다.
- 참조 타입은 변수는 메모리 주소를 저장하므로 메모리 사용량이 크게 증가할 수 있습니다.
참조 타입의 동등 비교 시 주의:
- 참조 타입의 변수는 메모리 주소를 비교하기 때문에 두 변수가 같은 값을 가리키는지 확인하려면 주의해야 합니다.
- 실제 값을 비교하기 위해서는 값을 직접 비교해야 합니다. (예: arr1 === arr2 대신 JSON.stringify(arr1) === JSON.stringify(arr2)를 사용하여 값 비교 가능)
참조 타입의 변경 가능성:
- 참조 타입은 값이 변경될 수 있으므로 주의해야 합니다.
- 한 변수에서 값을 변경하면 다른 변수도 같은 객체를 참조하므로 변경 내용이 공유됩니다.

위의 주의사항을 숙지하고 데이터 타입을 다룰 때 적절한 타입을 선택하여 사용하면 됩니다. 데이터의 특성과 요구사항에 맞게 값을 복사할지, 참조를 할지 결정하는 것이 중요합니다. 이를 통해 자바스크립트에서 데이터를 효율적으로 다룰 수 있습니다.