[코어 자바스크립트] 01. 데이터 타입(1)

1. 자바스크립트의 데이터 타입

 1) 기본형: 숫자 / 문자열 / 불리언 / null / undefined / Symbol 등

 2) 참조형: 객체(Map / WaekMap / set / WeakSet) / 배열 / 함수 / 날짜 / 정규표현식

 

 

2. 데이터 타입 관련 배경지식

 1) 비트: 컴퓨터는 모든 데이터를 0 또는 1로 바꿔 기억하며, 0 또는 1을 표현하는 하나의 메모리 조각

  -각 비트는 고유한 식별자를 가짐

 

 2) 바이트: 1바이트는 8비트로 0 또는 1 하나로만 된 비트 단위로 위치를 확인하는 비효율성을 줄이기 위해 8개의 비트를 묶어 놓은 것

  -각 바이트는 시작하는 비트의 식별자로 위치를 파악

  -모든 데이터는 바이트 단위의 식별자(메모리 주솟값)을 통해 서로 구분하고 연결

 

 3) 자바스크립트는 숫자의 경우 정수형인지 부동소수형인지 구분하지 않고 64비트(8바이트)를 확보하는 등 형 변환해야 하는 상황 감소

 

 4) 식별자: 어떤 데이터를 식별하는 데 사용하는 이름(변수명)

 

 5) 변수: 변할 수 있는 무언가

 

 

3. 변수 선언

// 방법 1
var a;
a = 'abc';

// 방법 2
var a = 'abc';

 1) 선언: 메모리에서 비어있는 공간을 확보, 그 공간의 이름을 설정

  -메모리의 빈 공간(@1003)을 확보하고, 식별자(변수명)를 a로 지정

 

 2) 할당: 식별자를 통해 공간을 검색하여 해당 공간에 데이터를 할당

  -데이터를 저장하기 위한 별도의 메모리 공간(@5004)을 다시 확보하여 문자열 'abc' 저장

  -문자열 'abc'가 저장된 메모리 공간의 주소(@5004)를 식별자를 a로 지정한 메모리 공간(@1003)에 대입

테이블 만들기

변수 영역	주소	...	1002	1003	1004	...
	데이터			이름: a 값: @5004
데이터 영역	주소	...	5002	5003	5004	...
	데이터				'abc'

 

 

4. 기본형 데이터와 참조형 데이터

 1) 불변값: 데이터 영역의 메모리 변경 가능성이 없는 값

  -기본형인 숫자, 문자, boolean, null, undefined, Symbol은 모두 불변값

  -변수와 상수의 구분도 변경 가능성이지만 이때의 변경 가능성은 변수 영역의 변경 가능성을 의미

// 1
var a = 'abc';
a = a + 'def';

// 2
var b = 5;
var c = 5;
b = 7

  -1번 예시: 변수 영역에서 식별자가 a인 공간에 'abc'라는 문자의 주소를 데이터 영역에서 찾아 주소를 할당

                  →'def'를 추가하여 'abcdef'라는 문자를 새로 할당하면 데이터 영역의 'abc'가 'abcdef로 바뀌는 것이

                      아닌 데이터 영역에 'abcdef'가 새롭게 추가되고 추가된 'abcdef'의 주소가 변수 영역의 a의 주소에 새로 할당

 

  -2번 예시: 변수 영역에서 식별자가 b인 공간에 5라는 숫자의 주소를 데이터 영역에서 찾아 주소를 할당

                  →변수 영역에서 식별자가 c인 공간에 5라는 숫자의 주소를 데이터 영역에서 찾아 주소를 할당(b에 할당된 5와 동일한 5)

                  →변수 영역에서 식별자가 b인 공간에 할당되어 있는 5를 7로 바꾸는 것이 아닌 데이터 영역에서 7이 할당된 주소를 찾아 7의 주소를 다시 할당

 

  -결론: 'abc', 'def', 'abcdef', 5, 7은 바뀔 수 없는 '불변값'

           / 선언된 a, b, c는 할당되는 값을 계속 바꿀 수 있는 '변수'

 

 2) 가변값

  -참조형 데이터 obj1에 값을 할당

var obj1 = {
  a: 1,
  b: 'bbb'
};

  (1) 변수 영역의 빈공간 @1003에 obj1 할당

  (2) 할당하려는 값을 데이터 영역에 저장하려는데 값이 여러 개로 이루어져 있으므로 그룹 별도의 변수 영역 생성(@7103~)하여 저장

      ※ 참조형 데이터에 계속 데이터가 추가될 수 있으므로 메모리 영역 크기는 동적으로 변할 수 있도록 할당

  (3) @7103과 @7104에 a와 b라는 이름의 식별자 지정

  (4) 다시 데이터 영역에서 a와 b에 할당할 값 1과 'bbb'를 찾거나 새로 할당(@5003, @5004), 각각의 데이터 주소를 @7103, @7104에 할당

     ※ @5003은 @7103에, @5004는 @7104에 할당

 

  - 변수 영역

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

 

  - 데이터 영역

주소	5001	5002	5003	5004	...
데이터	@7103 ~ ?		1	'bbb;

 

  - 객체 @5001의 변수 영역(기본형 데이터와 참조형 데이터의 차이점 → 객체의 변수 영역이 별도로 존재)

주소	7103	7104	7105	7106	...
데이터	이름: a 값: @5003		이름: b 값: @5004

 

  -만약 참조형 데이터 obj1의 변수 중 a의 값을 2로 변경한다면

var obj1 = {
  a: 1,
  b: 'bbb'
};

obj1.a = 2;

  -'변수 영역'에는 변화 없음

  -'데이터 영역'에 새로 할당될 값 2가 없다면 빈 공간에 2를 추가

  -'객체 @5001의 변수 영역'에서 식별자가 a인 @7103의 값이 데이터 영역에서 2가 있는 주소로 변경됨

 

 3) 기본형 데이터와 참조형 데이터의 복사

  -복사 과정은 동일

// 기본형 데이터
var a = 10;
var b = a;

// 참조형 데이터
var obj1 = {c:10, d: 'ddd'};
var obj2 = obj1;

  →변수 영역에서 식별자가 b인 주소에 데이터 영역에서 10의 주소를 할당

  →변수영역에서 식별자가 obj2인 주소에 데이터 영역에서 obj1의 객체의 주소를 가진 주소를 할당

 

  -복사 이후에 값을 변경할 때 차이

b = 15;
obj2.c = 20;

  →기본형 데이터 b를 변경할 때는 데이터 영역에 15가 새로 할당되고 변수 영역의 식별자가 b인 영역의 값 주소를 15의 주소로 변경

       (기본형은 '데이터 영역'의 주소를 '변수 영역'에 복사)

  →참조형 데이터 obj2의 변수 중 c를 변경할 때는 처음에 obj1의 변수 영역에 할당되었던 c의 값 주소가 데이터 영역에서 20의 주소로 변경

       (참조형은 '데이터 영역'의 주소를 'obj1의 변수 영역'에 복사→ 'obj1의 변수 영역'의 주소가 담긴 '데이터 영역'의 주소를 '변수 영역'에복사)

  →결론: 기본형 데이터는 복사 후 한 쪽의 값을 바꿔도 다른 쪽은 바뀌지 않음

                    참조형 데이터는 복사 후 한 쪽의 값을 바꾸면 다른 쪽도 바뀜

 

  -다른 경우(참조형 데이터에서 객체 자체를 바꾸는 경우): 데이터 영역의 새로운 공간에 객체가 저장되고 그 주소가 obj2에 위치하므로

                                                                                                                      위에서 기본형 데이터 변경과 같이 복사한 개체와 남남이 됨

obj2 = {c: 20, d: 'ddd'};

  →참조형 데이터가 '가변값'이라는 것은 그 내부의 변수를 변경할 때만 성립, 객체 자체를 변경할 때는 불변값(기존 데이터는 변하지 않음)