[JS] 원시타입과 참조타입의 차이

자바스크립트의 데이터 타입은 크게 두 가지로 나눠집니다.

"원시타입" 과 "참조타입"

구분이 되는 기준은 "참조의 유무"로 나눈다고 알고 있었지만 "원시타입"이 참조를 안하는 것은 아니였습니다.

좀더 원리를 알아보고 차이를 정리를 해보려고 합니다.

---

0. 배경지식

하나의 메모리 조각은 bit 라고 합니다. 그리고 1bit는 0,1 두가지의 값을 나타낼 수 있습니다.

각 비트들은 "고유한 식별자" 를 통해서 위치 확인이 가능합니다.

 

8개의 bit를 묶어서 byte라고 합니다.

byte 단위의 식별자, "메모리 주소값"을 통해서 모든 데이터를 연결하고 구분이 진행됩니다.

 

변수는 '변할수 있는 데이터' ,식별자는 "변수명"

즉, 변할수 있는 데이터인 변수의 이름은 식별자입니다.

원시타입과 참조타입은 변수가 할당되는 과정에서부터 차이를 보입니다.

 

1. 원시 타입

1. 변수 선언

var a;

• 메모리 데이터를 확보해서 식별자 'a'로 지정합니다. 단, 값은 지정되있지않습니다.

 

주소	2001	2002	2003
데이터		이름 : a 데이터 : " "

 

2. 변수 할당

var a = 'abc';

• 메모리 데이터에서 데이터 'abc' 넣을 자리를 확보하고
• 식별자 'a'의 값에 확보한 데이터 'abc'의 주소를 할당해줍니다.

 

<변수영역>

주소	2001	2002	2003
데이터		이름 : a 값: @7002

<데이터영역>

주소	7001	7002	7003
데이터		값: abc

여기서 알아야할 점은

메모리 공간이 데이터 성질에 따라 "변수영역" "데이터 영역" 으로 구분이 된다는 점입니다.

• 이는 데이터 공간의 유연성을 지키기 위함입니다.

 

데이터'abc' 값은 데이터 영역에 속하며 식별자'a' 는 변수영역에 속합니다.

두개의 영역이 서로 주소값을 통해 매칭된다고 이해하시면 됩니다.

 

var a = 'efg';

• 새로운 데이터가 할당된 경우 데이터 영역에서 'efg'를 찾고
  • 없으면 데이터 영역에서 새로 생성해서 해당주소를 식별자 'a'의 값에 할당합니다.
  • 있으면 그대로 주소를 식별자 'a'의 값에 할당합니다.

 

<변수영역>

주소	2001	2002	2003
데이터		이름 : a 값: @7003

<데이터 영역>

주소	7001	7002	7003
데이터		값: abc	값: efg

 

2. 참조 타입

var obj={
    name:"chulsu",
    age:46,
}

• obj 안에 여러가지의 프로퍼티를 갖고 있습니다.
• 그리고 그 프로퍼티는 각각 원시타입의 값을 할당하고 있습니다.

 

<변수영역>

주소	2001	2002	2003
데이터		이름 : obj 값: @4003

<데이터 영역>

주소	4001	4002	4003	...	5001	5002
데이터			값: @6040 ~ ?		값: chulsu	값: 46

<객체 @4003의 변수영역>

주소	6040	6041	6043
데이터	이름: name 값: @5001	이름: age 값: @5002

 

변수 영역에서 식별자 obj의 공간을 확보하고

값에 할당된 주소(@4003)는 각 프로퍼티에 해당되는 주소값들(@6040 ~ ?)이 있습니다.

그리고 obj에 할당되는 주소값 해당되는 변수영역을 마련해서 각 프로퍼티를 저장하기 위한 공간을 할당합니다.

 

이로써 원시타입과 참조타입의 할당에서 차이는 중간의 "객체의 변수 영역"이 됩니다.

 

정리하면

원시타입은 기본데이터 값이 담긴 주소를 바로 참조하는 반면

참조타입은 주소를 참조하는 과정이 한번 더 이뤄지는 것에서 차이가 있습니다.

( 중첩객체가 있다면 더 이뤄지겠죠?)

 

 

 

이 글은 "코어자바스크립트" 내용에 기반하여 작성한 글입니다.
잘못된 부분이나 이해가 잘못된 부분에 대해서는 댓글로 써주세요!