1장. 데이터 타입 (01. 데이터 타입의 종류 ~ 03. 변수 선언과 데이터 할당)

기본형과 참조형

자바스크립트가 구분하는 데이터 타입은 크게 두 가지로 분류할 수 있습니다.

기본형primitive type

• string, number, boolean, undefined, null, Symbol

참조형reference type

• Object(Array, Object, RegExp 등)

기본형은 값이 담긴 주소값을 바로 복제하는 반면,

참조형은 값이 담긴 주소값들로 이루어진 묶음을 가리키는 주소값을 복제한다는 점이 다릅니다.

이게 어떤 것을 의미하는지 알아보기 전에,

메모리와 데이터, 변수와 식별자 등에 대해서 알아보겠습니다.

 

 

---

메모리와 데이터

메모리

컴퓨터는 저장 할 때, 모든 데이터를 0과 1로 변경하여 저장합니다.

이 0과 1로 저장할 수 있는 하나의 단위를 비트bit라고 합니다.

수 많은 비트로 저장한 뒤, 저장한 정보를 찾을 때는 각 비트에 정해져 있는 식별자identifier를 통해 찾을 수 있습니다.

 

하지만 어떤 정보를 검색할 때 하나하나 비트의 식별자를 통해 찾는 것은 비효율적입니다.

그래서 이 비트들을 어떤 특정한 단위로 묶어서 정보를 탐색하면

표현할 수 있는 값도 늘어나고, 데이터를 찾는 시간도 줄일 수 있습니다.

이 특정 단위를 바이트byte라고 하고 8개의 비트로 구성하게 됩니다.

1바이트는 256개의 값을 표현할 수 있습니다. (2의 8제곱)

 

데이터

C/C++, 자바 등의 정적 타입 언어는 과거에는 메모리 용량이 부족했기 때문에

메모리의 낭비를 최소화 할 필요가 있었습니다.

그래서 데이터 타입 별(char, int, float...)로 할당할 메모리 영역을 정해놓았고

다른 타입으로의 할당 등을 연산 하기 위해 형변환이라는 과정을 거쳐야 했습니다.

 

하지만 현대에서는 과거에 비해 메모리의 용량이 커져 상대적으로 메모리 관리에 대한 압박이 줄어들었습니다.

그래서 자바스크립트는 데이터 타입별로 할당할 메모리의 영역을 넉넉하게 할당하게 되었습니다.

정수형인지, 부동소수점인지를 구분하지 않아 형변환을 해야하는 걱정을 훨씬 덜 하게 되었습니다.

 

 

---

식별자와 변수

변수variable

변할 수 있는 수를 뜻합니다.

수라고 해서 반드시 숫자를 의미하는 것이 아니라

단지 변할 수 있는 무언가라고 이해하면 되겠습니다.

식별자identifier

어떤 데이터를 식별하는데 사용하는 이름,

즉, 변수명을 뜻합니다.

 

 

---

변수 선언

자바스크립트에서 변수를 선언하는 방법은 아래와 같습니다.

var a;

• var - 변할 수 있는 데이터(변수)를 만든다.
• a - 데이터의 식별자는 a로 한다.

라고 이해할 수 있습니다.

이를 컴퓨터가 메모리 영역에서 어떻게 작업을 수행하는지 표로 단순하게 표현해 보겠습니다.

주소	...	1002	1003	1004	1005	...
데이터			이름: a 값:

1. 컴퓨터가 비어있는 공간 하나를 확보합니다. (@1003)
2. 이 공간의 이름(식별자)을 a라고 정합니다.
3. 변수 선언 완료

 

---

데이터 할당

자바스크립트에서 데이터를 할당하는 방법은 아래와 같습니다.

// 1. 
var a;  // 변수 a 선언
a = 'abc'; // 변수 a에 데이터 할당

// 2. 
var a = 'abc'; // 변수 선언과 하당을 한 문장으로 표현

1번과 2번은 동일한 동작을 수행합니다.

 

a라는 변수명 주소에 "abc"를 바로 할당하는 것이 아닙니다.

변수는 메모리 주소의 변수 영역에, 데이터는 메모리 주소의 데이터 영역에 할당합니다.

변수의 값은 해당 데이터 영역의 메모리 주소를 할당합니다.

다시 표로 한번 보겠습니다.

• 변수 영역

주소	...	1002	1003	1004	1005	...
데이터			이름: a 값: @5004

• 데이터 영역

주소	...	5002	5003	5004	5005	...
데이터				"abc"

1. 변수 영역에서 빈 공간(@1003)을 확보합니다.
2. 확보한 공간의 식별자를 a로 지정합니다.
3. 데이터 영역의 빈 공간(@5004)에 문자열 "abc"를 저장합니다.
4. 변수 영역에서 a라는 식별자를 검색합니다 (@1003)
5. 앞서 저장한 문자열의 주소(@5004)를 @1003의 공간의 데이터로 대입합니다.

 

여기서 의문점이 들 수 있습니다.

왜 변수영역의 값에 바로 "abc"를 저장하지 않는지 말입니다.

 

결론부터 말하면

1. 데이터의 변환을 자유롭게 할 수 있다.
2. 메모리를 효율적으로 관리할 수 있다.

의 이유로 채택된 방식입니다.

 

 

자바스크립트는 숫자형 데이터에 대해 8바이트의 공간을 확보합니다.

하지만 문자열의 경우는 특별히 정해진 공간이 없습니다.

한 글자마다 영어는 1바이트, 한글은 2바이트 등으로 가변적인 데이터 타입이기 때문입니다.

 

만약 변수 영역과 데이터 영역을 분리해서 별도로 할당하는 방식이 아니라면,

아래와 같은 상황이 발생할 수 있습니다.

기존에 존재하는 데이터보다 더 큰 데이터를 할당할 때
기존 영역보다 더 큰 메모리의 데이터를 할당하려면 기존 영역의 메모리를 늘린 뒤 할당해야 한다.
데이터 중간에 데이터를 삽입한다면, 해당 공간보다 뒤에 저장된 데이터들을 전부 뒤로 옮기고, 이동 시킨 주소를 각 식별자에 다시 연결하는 작업을 해야 한다.
→ 컴퓨터가 처리할 연산이 더 많아져 비효율적이다.

500개의 변수를 만들어 동일한 데이터 값을 할당한다면?
500 X (500 X 데이터 크기)의 값을 사용한다.
→ 데이터 영역을 분리하여 동일한 데이터에 대한 주소값만 저장하게 된다면, 500 X (1 X 데이터 크기)만 있으면 된다.
(더 자세히 하면 (1 X 데이터 크기) 주소값의 크기 X 500 만큼 더 사용된다.)

 

 

개인적인 궁금증: 동일한 크기의 데이터라면 같은 메모리 주소에 덮어써도 되지 않을까?
자바스크립트는 런타임 시에 자바스크립트 엔진이 코드를 해석하여 실행하는 인터프리터 언어입니다.
따라서 개발자가 임의로 원시 메모리 주소를 제어 하는 행위를 할 수 없고
자바스크립트 엔진이 동작하는 방식(알아서 비어있는 원시 메모리 주소에 데이터를 할당하는 등)을 따를 수 밖에 없습니다.

이 자바스크립트 엔진은 코드에서 변수에 데이터가 할당될 때,
이미 존재하는 메모리 주소를 찾아 재할당 하는 방식으로는 동작하지 않습니다.
말 그대로 개발자가 같은 원시 메모리 주소에 다른 데이터를 덮어쓰고 싶어도 할 수 없다는 의미입니다.

그 외에도 원시 메모리 주소에 할당되는 값들은 불변 값으로 저장되기 때문에
불변 값만이 제공하는 이점들이 많이 있어 굳이 동일한 메모리 주소에 재할당하는 과정을 할 필요성이 없습니다.
어떤 곳에도 참조되지 않는 데이터라면  GC(가비지 컬렉터)가 알아서 제거해주기 때문에
과거 데이터가 계속 남아있어 관리하게 되는 불필요함도 줄입니다.

 

 

 

출처 : 코어 자바스크립트

코어 자바스크립트 - YES24

---

잘못되어 수정해야 하거나 피드백 주실 부분이 있으시면 언제나 환영입니다!