06장 데이터 타입

0. 데이터 타입이란?

• 데이터 타입은 값의 종류를 말합니다.
• 자바스크립트는 값에 따라 타입이 결정되는 동적 타입 언어 입니다.
• 변수에 어떤 타입의 값이든 할당 가능합니다.

구분	타입	예시
원시 타입	number	1, 3.14, NaN
원시 타입	string	“hello”, ‘hi’
원시 타입	boolean	true, false
원시 타입	undefined	선언 후 할당 전
원시 타입	null	의도적 비어 있음
원시 타입	symbol	고유하고 변경 불가한 값
객체 타입	객체	객체, 함수, 배열 등

let foo = 42; // number
foo = "Hello"; // string
foo = true; // boolean

1. 숫자 타입

• 다른 언어와 다르게, 자바스크립트는 하나의 숫자 타입만 존재합니다.
• 숫자 타입의 값은 모두 메모리에 배정밀도 64비트 부동소수점 형식의 2진수로 저장됩니다.
• 모든 수를 실수로 처리하며 정수만 표현하기 위한 데이터 타입이 별도로 존재하지 않습니다.
• 2진수, 8진수, 16진수 등을 표현하기 위한 데이터 타입을 제공하지 않아서 참조하면 모두 10진수로 해석됩니다.
• 모든 수를 실수로 처리하기 때문에, 정수로 표시해도 사실 실수라는 것을 의미합니다.

// 숫자 타입은 모두 실수
console.log(1 === 1.0); // true
console.log(4 / 2); // 2
console.log(3 / 2); // 1.5

• 숫자 타입은 특별한 값을 포현할 수 있습니다.
  • Infinity : 양의 무한대
  • -Infinity : 음의 무한대
  • NaN : 산술 연산 불가 (not-a-number)

2. 문자열 타입

• 텍스트 데이터를 나타내는 데 사용합니다.
• 0개 이상의 16비트 유니코드 문자 (UTF-16)의 집합으로 전 세계 대부분의 문자를 표현할 수 있습니다.
• 작은따옴표, 큰따옴표, 백틱으로 텍스트를 감싸 사용합니다.

let string;

string = "문자열";
string = "문자열";
string = `문자열`;

string = '작은따옴표 안에 "큰따옴표"는 문자열로 인식됩니다.';
string = "큰따옴표 안에 '작은따옴표'는 문자열로 인식됩니다.";

3. 템플릿 리터럴

• ES6부터 도입된 새로운 문자열 표기법입니다.
• 멀티라인 문자열, 표현식 삽입, 태그드 템플릿 등의 문자열 처리 기능을 제공합니다.
• 백틱 (``)을 사용해 표현합니다.

let template = `Template literal`;

3-1. 멀티라인 문자열

• 일반 문자열 내에서는 줄바꿈(개행)이 허용되지 않아 백슬래시로 시작하는 이스케이프 시퀀스를 사용해야 하지만, 템플릿 리터럴 내에서는 줄바꿈이 허용됩니다.

이스케이프 시퀀스	의미
\0	Null
\b	백스페이스
\f	폼 피드(Form Feed): 프린터로 출력할 경우 다음 페이지의 시작 지점으로 이동한다.
\n	개행(LF, Line Feed): 다음 행으로 이동
\r	개행(CR, Carriage Return): 커서를 처음으로 이동
\t	탭(수평)
\v	탭(수직)
\uXXXX	유니코드. 예를 들어 '\u0041'은 'A', '\uD55C'는 '한', '\u{1F600}'는 😀이다.
'	작은따옴표
"	큰따옴표
\	백슬래시

3-2. 표현식 삽입

• 문자열은 + 문자열 연산자를 사용해 연결할 수 있지만, 템플릿 리터럴을 사용하면 간편하게 조합할 수 있습니다.

let first = "seongho";
let last = "Choi";

console.log(`My name is ${first} ${last}.`); // My name is Choi seongho.

4. 불리언 타입

• 참과 거짓으로 구분되는 조건에 의해 프로그램의 흐름을 제어하는 조건문에서 자주 사용합니다.

5. undefined 타입

• 자바스크립트 엔진이 변수를 초기화할 때 사용하는 값입니다.
• 변수를 참조했을 때 undefined가 반환된다면 참조한 변수가 선언 이후에 값이 할당된 적이 없는 상황입니다.
• 변수에 값이 없다는 것을 명시하고 싶을 때는 undefined가 아닌 null을 할당합니다.

6. null 타입

• 변수에 값이 없다는 것을 의도적으로 명시(의도적 부재 intentional absence)할 때 사용합니다.
• 함수가 유효한 값을 반환할 수 없는 경우에도 명시적으로 null을 반환하기도 합니다.
  • document.querySelector 메서드 사용 시 조건에 부합하는 HTML 요소가 없을 경우 null을 반환합니다.

7. 심벌 타입

• ES6에서 추가된 타입으로, 변경 불가능한 원시 타입의 값입니다.
• 심벌 값은 다른 값과 중복되지 않는 유일무이한 값입니다.
• 이름이 충돌할 위험이 없는 객체의 유일한 프로퍼티 키를 만들기 위해 사용합니다.
• 심벌 이외의 원시 값은 리터럴을 통해 생성하지만, 심벌은 Symbol 함수를 호출해 생성합니다.
• 이때 생성된 심벌 값은 외부에 노출되지 않으며, 다른 값과 절대 중복되지 않는 유일무이한 값입니다.

// 심벌 값 생성
let key = Symbol("key");

// 객체 생성
let obj = {};

// 이름 충돌 위험 없는 심벌을 프로퍼티 키로 사용합니다.
obj[key] = "value";
console.log(obj[key]); // value

8. 객체 타입

• 자바스크립트를 이루고 있는 거의 모든 것이 객체입니다.

9. 데이터 타입의 필요성

9.1 데이터 타입에 의한 메모리 공간의 확보와 참조

어떤 값을 사용하려면, 해당 값을 메모리에 저장하고 참조할 수 있어야 합니다. 이를 위해서는 먼저 그 값을 저장할 메모리 공간의 크기를 알아야 하며, 이 크기는 변수에 할당되는 값의 데이터 타입에 따라 결정됩니다.

값을 참조할 때는, 변수명(식별자)을 통해 해당 값이 저장된 메모리 공간의 시작 주소를 찾게 됩니다. 이때 데이터 타입에 따라 미리 정해진 크기만큼의 메모리 셀을 읽게 되는데, 예를 들어 숫자 타입 값은 8바이트 단위로 저장되므로 참조 시에도 8바이트 단위로 메모리 값을 읽어들입니다.

9.2 데이터 타입에 의한 값의 해석

• 메모리에 저장된 2진수(비트열)는 데이터 타입에 따라 다르게 해석됩니다.
• 예: 0100 0001은 숫자 65로 해석할 수도 있고, 문자 ‘A’로 해석할 수도 있습니다.
• 변수에 할당된 값은 그 변수의 데이터 타입에 맞춰 해석된다.
• 데이터 타입이 필요한 이유:
  1. 값을 저장할 때 필요한 메모리 공간의 크기를 결정하기 위해
  2. 값을 읽어올 때 한 번에 읽을 메모리 크기를 결정하기 위해
  3. 메모리에서 읽어온 2진수를 어떻게 해석할지 결정하기 위해

10. 동적 타이핑

자바스크립트는 동적 타입 언어입니다.
즉, 변수의 타입이 고정되어 있지 않고, 할당된 값에 따라 런타임 시점에 타입이 결정됩니다.

• 변수 선언 시 타입을 명시하지 않습니다.
• 값이 할당되는 순간, 변수의 타입이 동적으로 결정됩니다.
• 변수에는 언제든지 다른 타입의 값을 할당할 수 있습니다.

예시 코드:

let value; // undefined
value = 10; // number
value = "hello"; // string
value = true; // boolean
value = null; // object (typeof 결과)
value = Symbol(); // symbol
value = { a: 1 }; // object
value = [1, 2, 3]; // object
value = () => {}; // function

typeof 연산자를 사용하면 변수의 데이터 타입을 런타임에 알 수 있습니다.

console.log(typeof value); // 각 값 할당 후마다 타입이 바뀜

동적 타이핑의 특징

• 변수에 어떤 타입이든 자유롭게 할당 가능합니다.
• 선언된 변수의 타입이 계속 바뀔 수 있습니다.
• 편리하지만, 런타임 오류가 발생하기 쉽기 때문에 변수의 의도와 사용에 주의해야 합니ㅏㄷ.

동적 타입 언어 vs 정적 타입 언어

	동적 타입 언어 (JS 등)	정적 타입 언어 (C, Java 등)
변수 선언 시 타입 명시	X	O
변수 타입 변경	자유로움	불가 (컴파일 에러)
타입 오류 발생 시점	런타임	컴파일 타임

동적 타이핑 덕분에 자바스크립트는 빠른 프로토타이핑과 유연한 코딩이 가능하지만,
타입 혼동으로 인한 버그가 발생하지 않도록 변수의 용도와 이름을 명확히 작성하는 것이 중요합니다.