06 데이터 타입

자바스크립트의 모든 값은 데이터 타입을 갖는다. 자바스크립트(ES6)은 7개의 데이터타입을 제공한다. 크게 [원시타입]과 [객체타입]으로 분류할 수 있다.

  1. 원시타입 : number, string, boolean, undefined, null , symbol

  2. 객체타입 : 객체 , 함수 , 배열 등

6.1 숫자타입

다양한 숫자 타입을 갖는 c, java 등의 언어와는 다르게 자바스크립트는 하나의 숫자타입을 가진다. 모든 수를 실수로 처리하며, 정수만을 위한 데이터타입이 별도로 존재하지 않는다. 

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

숫자타입은 추가적으로 세 가지 특별한 값도 표현 가능.

  • Infinity

  • -Infinity

  • NaN : 산술 연산 불가 (not-a-number)

6.2 문자열 타입

일반적으로 따옴표나 백틱(``)으로 감싸서 표현한다. 따옴표로 감싸지 않으면 자바스크립트 엔진은 키워드나 식별자같은 토큰으로 인식한다.

// 따옴표로 감싸지 않은 hello를 식별자로 인식한다.
var string = hello; // ReferenceError: hello is not defined

자바스크립트의 문자열은 원시타입이며 변경 불가능한 값이다.

6.3 템플릿 리터럴

ES6 부터 템플릿 리터럴 이라는 새로운 문자열 표기법이 도입됨. 멀티라인 문자열, 표현식 삽입, 태그드 템플릿 등을 편리하게 할 수 있다. 백틱(``)을 사용해서 표현한다.

6.3.1 멀티라인 문자열

일반 문자열 내에서는 줄바꿈, 공백 등을 표현하려면 백슬래시(\)로 시작하는 [이스케이프 시퀀스]를 사용해야 한다.

이스케이프 시퀀스
표현

\a

벨(경고)

\b

백스페이스

\f

폼 피드

\n

개행 Line Feed ,다음 행으로 이동

\r

개행 Carriage Return, 커서를 처음으로 이동

\t

가로 탭

\v

세로 탭

\'

작은따옴표

\"

큰따옴표

\\

백슬래시

HTML을 문자열로 표현하면 다음과 같다.

var template = '<ul>\n\t<li><a href="#">Home</a></li>\n</ul>';

console.log(template);
/*
<ul>
  <li><a href="#">Home</a></li>
</ul>
*/

템플릿 리터럴으로 표현 

var template = `<ul>
  <li><a href="#">Home</a></li>
</ul>`;

console.log(template);
/*
<ul>
  <li><a href="#">Home</a></li>
</ul>
*/

6.3.2 표현식 삽입

  • 피연산자중 문자열이 하나라도 포함될 때 +연산자 사용해서 연결

  • 표현식 삽입시 ${ }으로 감싸기 (반드시 템플릿 리터럴 내에서만 가능하다)

6.4 불리언타입

true / false

6.5 undefined 타입

var 키워드로 변수를 선언할 시 자바스크립트 엔진이 암묵적으로 undefined로 초기화한다. 따라서 undefined는 자바스크립트 엔진의 의도가 담긴 타입이기 때문에, 개발자가 의도적으로 값이 없음을 명시하고 싶을 때에는 null 을 활용할 것을 권장한다.

6.6 null 타입

값이 없다는 것을 의도적으로 명시( 의도적 부재 )

변수에 null을 할당하는 것은 변수가 이전에 참조하던 것을 더이상 참조하지 않겠다는 의미이므로 자바스크립트 엔진은 누구도 참조하지 않는 메모리에 대해 [가비지 컬렉션]을 수행한다.

6.7 심벌 타입

ES6에서 추가된 7번째 타입으로 변경 불가능한 원시 타입의 값이다. Symbol 함수를 호출해 생성하며 심벌 값은 외부에 노출되지 않고, 다른 값과 절대 중복되지 않는 유일무이한 값이기에 주로 객체의 유일한 프로퍼티 키를 만들 때에 사용된다. ( CH 33. 7번째 타입 Symbol 에서 자세히 )

// 심벌 값 생성
var key = Symbol('key');
console.log(typeof key); // symbol

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

// 이름이 충돌할 위험이 없는 유일무이한 값인 심벌을 프로퍼티 키로 사용한다.
obj[key] = 'value';
console.log(obj[key]); // value

6.8 객체 타입

자바스크립트는 객체 기반의 언어이며, 자바스크립트를 이루고 있는 거의 모든 것이 객체이다. 원시타입 이외의 모든 값은 모두 객체 타입이다. ( 11. 원시 값과 객체의 비교 에서 자세히 )

6.9 데이터 타입의 중요성

  • 값을 저장할 때 확보해야 하는 메모리 공간의 크기를 결정하기 위해

  • 값을 참조할 때 한 번에 읽어 들여야 할 메모리 공간의 크기를 결정하기 위해

  • 메모리에서 읽어들인 2진수를 어떻게 해석할 지 결정하기위해 ( 2진수로 표현된 값 '0100 0001' 은 숫자타입일 때 65지만 문자열일 때 'A'이다.

6.10 동적 타이핑

C나 java 같은 정적 타입 언어는 변수를 선언할 때에 할당 가능한 값의 타입을 미리 선언해야 한다. 이를 [명시적 타입 선언] 이라고 한다. 따라서 컴파일 시점에 타입 체크를 진행하고 에러를 발생시켜 일관성을 유지하도록 한다.

이에 반해 자바스크립트는 변수를 선언할 때에 타입을 선언하지 않으며 어떠한 타입이라도 할당 가능하다. 자바스크립트의 변수는 선언이 아닌 할당에 의해 타입이 결정되므로 변수의 타입이 언제든 동적으로 변할 수 있다. 이를 [동적 타이핑] 이라고 부르며 정적 타입 언어와 구별하기 위해 [동적 타입 언어]라 한다.

동적 타입 언어는 유연성은 높지만 신뢰성은 떨어진다.

코드는 오해하지 않도록 작성되어야 하며, 오해는 커뮤니케이션을 어렵게 하고 생산성을 떨어뜨린다. 코드는 동작하는 것만이 목적이 아니다. 코드는 개발자를 위한 문서이기도 하다. 따라서 사람이 이해할 수 있는 코드, 즉 가독성이 좋은 코드가 좋은 코드다.

Last updated