데이터 타입

자바스크립트의 자료형: 동적 타이핑

• 자바스크립트는 느슨한 타입(loosely typed) 언어, 혹은 동적(dynamic) 언어이다.
• 변수가 가지는 고정 타입이 없다. 하지만 타입이 없는 것은 아니다.
• 변수의 타입을 미리 선언할 필요가 없다는 뜻이다.
• 타입은 프로그램이 처리되는 과정에서 자동으로 파악될 것이다.
• 이것은 곧 같은 변수에 여러 타입의 값을 넣을 수 있다는 뜻이다.

 

1. Boolean

Boolean은 참/거짓 두 가지 종류의 값만 나타낼 수 있다.

const isTure = true;
const isFalse = false;
const b = Boolean(false);   // Boolean값이 false 인 것을 b에 할당

// *typeof: 변수의 타입을 확인하는 키워드
console.log(isTrue, typeof isTrue);       // true 'boolean'
console.log(isFalse, typeof isFalse);     // false 'boolean'
console.log(b, typeof b);                 // false 'boolean'

*Boolean을 객체로 만들어서 사용하지 않는 이유

조건문은 true/false 여부를 평가해서 조건문을 사용하게 된다. 

아래의 예시에서 Boolean의 초기값으로 false라는 거짓값을 넣었다.

a는 객체이다. if 조건문 ( ) 안에서 객체일 경우에는 평가될 때 true로 평가된다. → 조건문 내부 코드 실행

Boolean의 값은 false지만 if문이 실행되기 때문에 헷갈릴 위험이 있다.

따라서 보통은 Boolean을 객체로 만들어서 사용하지는 않는다.

const a = new Boolean(false);   // *new: 새로운 객체 생성
console.log(a, typeof a);       // [Boolean: false] 'object'

if (a) {
	console.log('false?');      // false?
}

 

2. Null

값은 가지고 있지만 비어있는 값인 객체(object)이다.

값이 없다! 라고 선언할 때 사용한다.

const a = null;
console.log(a, typeof a);   // null 'object'

 

3. Undefined

아무런 값을 할당하지 않았을 때 undefined 상태이다.

아직 값이 설정되지 않은 상태이다.

let b;
console.log(b, typeof b);   // undefined 'undefined'

null과 undefined 비교하기

자바스크립트에서 "없음"을 의미하는 데이터 타입엔 두 종류가 있다.

null과 undefined 둘 다 값이 없음을 의미하는 것은 같다.

하지만 null 은 우리가 없다고 고의적으로 설정하는 값을 의미하고, undefined 는 우리가 설정을 하지 않았기 때문에 없는 값을 의미한다.

 

조건문을 통해서 두 개의 값을 비교하면 같다고 출력된다.

== 2개는 값을 비교

=== 3개는 값과 타입까지 비교

=== 3개를 이용해서 값을 비교할 떄는 두 값이 다르다고 나온다.

const a = null;   // a = null
let b;            // b = undefined

if (a == b) {
	console.log(a == b);
}
// 'true'

 

4. Number

숫자형: 정수, 소수, NaN

*NaN: Not a number. "수학적으로 정의가 안됨"

• Number( ) 함수를 이용해서 문자열을 숫자형태로 바꿀 수 있다.
• 문자열의 형변환이 제대로 안됐을 경우 NaN이 출력된다.

// 문자는 숫자로 형변환이 불가. 숫자형으로 바뀌어도 NaN. 숫자를 나타내지는 않는다.
const d = Number('Mark');
console.log(d, typeof d);   // NaN 'number'

// 문자열 '37'을 숫자로 형변환. 문자형 '37'에서 숫자형 37로 변환
const e = Number('37');
console.log(e, typeof e);   // 37 'number'

 

5. String

텍스트(문자열) 형태의 값은 작은 따옴표 혹은 큰 따옴표로 감싸서 선언한다.

작은 따옴표와 큰 따옴표 사용에 있어서 큰 차이는 없다.

const a = 'Mark';
console.log(a, typeof a);   // Mark string

const b = 'Mark' + 'Lee';
const c = a + 'Lee';
console.log(c, typeof c);   // Mark Lee string

Template string (템플릿 스트링)

위와 같이 기존의 문자열을 결합할 때는 + 를 사용하여 연결할 수 있었다.

es6부터는 template string을 이용해서 한 문자열 내에서 변수와 상수 기존의 데이터를 통합해서 표현할 수 있다.

 

` 사이 내부에 작성해서 문자열처럼 사용하면 된다. ` `

` ` 내부에는 자바스크립트의 표현식*을 사용해서 결과를 문자열로 바꿀 수 있다.

*자바스크립트 표현식: return될 수 있는 형태

객체를 입력할 때는 ${객체이름} 형태로 삽입한다. 

const a = 'Mark';
const d  = `${a} Lee`;
console.log(d, typeof d);   // Mark Lee string

 

6. Symbol

Symbol은 es6부터 출현하였다.

고유한 값을 만들어내고 싶을 때 symbol로 만들어서 사용한다. (= 만들어진 심볼은 고유)

Symbol은 new를 통해서 만들어내지 못한다. (심볼은 생성자 함수를 통해서 사용할 수 없다.)

new Symbol();   // error

const a = Symbol();
const b = Symbol(37);
const c = Symbol('Mark');
const d = Symbol('Mark');

console.log(a, typeof a);    // Symbol() 'symbol'
console.log(c == d);         // false