탕구리's 블로그

Primitive Type & Reference Type 본문

javascript

Primitive Type & Reference Type

탕구리당 2019. 5. 29. 16:16
반응형

자바스크립트 데이터 타입

자바스크립트의 변수 타입에는 크게 Primitive type(원시타입)과 Reference Type(참조타입)으로 나누어 생각할 수 있습니다. 원시타입이란 자바스크립트 자체에서 제공하는 타입이며 변수 할당시 메모리에 직접 접근합니다. 반면에 참조 타입은 메모리에 직접 접근이 아닌 컴퓨터 바탕화면에 바로가기를 만드는 것 처럼 간접적인 참조를 통해 메모리에 접근하는 데이터 타입입니다.

 

 

 

Primitive type : 원시타입 : 기본타입과 복사

자바스크립트의 자료형에는 6가지의 기본 자료형(string, number, boolean, undefined, null, symbol)이 있습니다. 이런 Primitive type의 변수는 변수가 할당될 때, 메모리의 고정 크기로 값을 저장하고 해당 주소를 직접 참조 합니다. 또한, 불변성(immutable)이라는 특징을 가지고 있죠. 그럼 이 불변성이라는게 무엇일까요? "Primitive type으로 선언한 변수는 변하지 않는다" 입니다.

 

간단한 예를 하나 들어볼게요

 

line 1: var x = 100;
line 2: x = 10;

 

우선, line 1번에서 변수 x에 값을 할당하였고 line 2번에서는 x의 값을 수정하는 작업을 하였습니다.

Primitive type의 변수에 메모리를 할당하는 방식은 아래와 같습니다.

 

 

primitive type의 immutable

 

변수 x 선언시 메모리에 공간을 할당 받습니다. 하지만 x의 값을 수정하고 난후, 기존의 x가 가지고 있던 메모리의 값이 변경되는 것이 아닌 새로운 공간을 할당 받아 값을 가지게 됩니다. 이렇게 값에 대한 수정이 일어나더 라도 새로운 메모리를 할당 받아 수정한 것 처럼 진행합니다. 불변성(immutable)이란 이런 것을 의미합니다.

 

Primitive type 변수의 값 복사는 다음과 같이 이루어 집니다.

 

line 1: var x = 100;
lline 2 : var y = x;
line 3: x = 10;

console.log(y);

 

Primitive type 변수의 값의 복사가 이루어진 경우는 다음과 같습니다.

 

새로운 변수 y에 x의 값을 대입하게 되면, 변수 y의 공간에는 값을 통째로 복제하여 변수안에 담게 된다. 그렇기에 값이 수정 되더라도 서로에게 영향을 미치지 않는다. 

 

 

 

Reference Type : 참조 타입

자바스크립트의 참조 타입에는 대표적으로 객체(Object)가 있습니다. 위에서 알아본 원시타입의 변수를 제외한 모든 객체는 참조타입 입니다. 참조형 변수는 Heap 영역에 생성되며, 이 Heap 메모리의 값은 값이 할당된 메모리의 주소를 참조하고 있습니다.

 

예를 통해 알아보는게 이해하기 가장 좋은 방법이죠 :)

 

line 1 : var a = [1,2,3];
line 2 : var b = a;
line 3 : b[1] = 3;

console.log(a) // [1,3,3]

 

line 1~2이 실행 되었을 때의 상태입니다. 변수 a와 b는 같은 메모리 주소를 참조하고 있습니다.

 

line3에서 배열의 값이 변경 되었을 때, a와b는 같은 메모리를 참조하고 있기 때문에 b를 수정하면 a가 참조하는 값의 내용도 변하게 됩니다.

 

 

Reference  type의 변수 할당과 참조는 위와 같이 이루어지기 때문에 변수의 복사나 변경 시 참조 여부를 잘 생각하고 이용해야 합니다.

반응형

'javascript' 카테고리의 다른 글

Call stack & Event loop  (0) 2019.05.28
javascript Call & Apply, Bind  (0) 2018.09.13
ES6 화살표함수(arrow function) & thisArg  (0) 2018.09.13
Comments