본문 바로가기

Kakao Cloud School/카카오클라우드스쿨 수업

[Javascript] 데이터 타입

데이터타입


기본적인 용어

1. literal (리터럴)

특정 값을 나타내기 위해 사람이 이해할 수 있는 문자, 약속된 기호, 기호를 이용하는 notation(표기법)

1 ) 3 - 숫자 literal
2 ) 'Hello', "Hello", `Hello`(ES6에 새롭게 표현된 문자열) - 문자literal
3 ) null(개발자가 직접 사용하는 값) - null literal
4 ) undefined(변수가 있는데 아직 초기화가 이루어지지 않았다는 것을 의미) -undefined literal
5 ) {'name' : 'kim'} - 객체 literal
6 ) [1, 2, 3] - 배열 literal
7 ) function( ){ } -함수 literal

2. statement(문)

- 프로그램의 최소 실행 단위이다. (프로그램은 statement의 집합)
- statement를 구성하는 단위는 토큰이라고 한다. (토큰은 더이상 분해할 수 없는 요소들을 가리킨다)
- ; (세미콜론)은 statement의 종료를 나타내는 토큰이다.

- 중괄호와 같은 블록은 자체적으로 문장을 종료 시키는 기능이 있다. 그래서 ; 을 붙일 필요가 없다.
- 세미콜론은 당연히 찍어줘야 된다.

 

- 하지만 다음과 같은 코드도 제대로 출력된다.

 

let myVar = 1 

{ 
    console.log(myVar) 
}

// 1 출력

 

왜? Javascript Engine이 세미콜론을 생략하면  ASI 자동 인식을 하게 되어 자동으로 세미콜론이 삽입된다.

하지만 명확한 코드를 위해서는 세미콜론을 생략하면 안된다.

3. Expression(식)

- 평가 과정을 통해 값으로 인식되는 구문을 의미한다.

Javascript의 Data Type


총 7개의 데이터 타입이 있다.

 

1. number type primitive type (원시타입) - 절대 불변하는 타입
2. string type
3. boolean type
4. undefined type
5. null type
6. symbol type (ES6에서 추가됨)
7. object type reference type

1. number type

- 정수, 실수를 구분하지 않는다.
- 모든 숫자는 64-bit 실수로 처리한다.

 

let myVar = 1.0;
console.log(myVar === 1); // 1을 1.0으로 인식
// true 반환

console.log(3/2); // 1.5

※ == 비교, === 비교

== 비교 : 값이 같은지 확인한다.
=== 비교 : 값과 타입까지 같은지 확인한다.

※  숫자 타입에 속하는 특수한 값

infinity : 양의 무한대
- infinity : 음의 무한대
NaN : not a number, 신술 연산 불가

2. String type

- ' ', " ", ` ` - ' '이 가장 기본 형태
- ` ` 사용

1. 멀티 라인 문자열 표현할 수 있다.

let str = '이것은 \n 소리없는 \n 아우성';

console.log(str);

let str1 = `이것은
소리없는
아우성`

2. Exprestion Interpolation(표현식, 삽입)

let name1 = '홍길동';
console.log('내 이름은 ' + name1 + '입니다');
console.log(`내 이름은 ${name1}입니다`);

3. boolean type

- true, false

4. undefined type

- undefined : 자바스크립트 엔진에 의해서 초기화 시킬 때

5. null type

- null : 개발자가 해당 변수에 값이 존재하지 않아, 어떠한 값도 존재하지 않는다는 것을 명시하기 위한 값

6. symbol type

ES6에서 추가된 symbol type이 있다.
symbol 타입의 값은 symbol 값이다.

symbol 값은 겹칠 수 없으며, 무조건 Unique한(고유한) 값만 만들어야 된다.
symbol 값은 출력이 안되어, 우리 눈으로 확인할 수 없다.
자바스크립트의 내장함수인 Symbol( ) 함수를 이용하여 만들 수 있다.

# 인자없이 심볼 값 만들기

const mySymbol = Symbol();

// typeof 해당 변수가 가지고 있는 데이터 타입을 알려줌
console.log(typeof mySymbol); 
console.log(mySymbol); // Symbol() 값이 노출되지 않음

const mySymbol1 = Symbol();
const mySymbol2 = Symbol();

console.log(mySymbol1 === mySymbol2); //false

# 인자를 주고 심볼 값 확인해보기

- Symbol( )에 인자를 사용할 수 있지만, 실제 symbol 값에 영향을 주지 않는다.

 

// Symbol 값에 인자를 주는 경우
// 인자를 주고 만들어도 결과는 같이 false
// 인자는 내가 가지고 있는 심볼에 대한 description(꼬리표)일 뿐임, 심볼값과 연관성이 없음
const mySymbol1 = Symbol('소리없는 아우성');
const mySymbol2 = Symbol('소리없는 아우성');

console.log(mySymbol1 === mySymbol2); //false
console.log(mySymbol1.description); //소리없는 아우성

# 심볼값 존재 유무 확인해보기

// Symbol 값에 인자를 주는 경우
// 인자를 주고 만들어도 결과는 같이 false
// 인자는 내가 가지고 있는 심볼에 대한 description(꼬리표)일 뿐임, 심볼값과 연관성이 없음
// 심볼값은 값이 무엇인지 알 수 없음
const mySymbol1 = Symbol('소리없는 아우성');
const mySymbol2 = Symbol('소리없는 아우성');

// 해당 심볼이 있는 지 확인은 가능하다
if (mySymbol1) {
    console.log('있어요!');
}

 

Symbol( )을 사용할 때 많이 사용하는 메서드 (Symbol.for( ), Symbol.keyFor( ))

# Symbol.for( )

- key 값을 이용해서 심볼을 찾거나 못 찾으면 심볼을 등록하고하고 리턴한다.

  (global symbol registry에 Symbol을 찾기위한 메서드)

 

const s1 = Symbol.for('mySymbol');
// global symbol registry라는 곳이 있다 (전역 심볼 저장소)
// 일단 거기에서 해당 인자를 키로 가지고 있는 symbol을 찾는다.
// 만약 존재하지 않으면 symbol을 만들고
// global symbol registry에 등록하고 symbol을 리턴한다.

const s2 = Symbol.for('mySymbol');

console.log(s1===s2); //true

# Symbol.keyFor( )

Symbol 키를 찾기위한 메서드 - 심볼 값으로 key를 찾는다.

 

const s2 = Symbol.for('mySymbol');

console.log(s1===s2); //true

//심볼을 가지고 키를 찾는 과정
console.log(Symbol.keyFor(s2)); // mySymbol

# 심볼 사용 예

- 절대 겹치지 말아야할 값들을 내가 동적으로 만들어서 사용해야할 때 심볼을 사용한다.

 

const Direction = {
    'UP' : Symbol(),
    'DOWN' : Symbol(),
    'LEFT' : Symbol(),
    'RIGHT' : Symbol()
}

// value 값은 크게 의미가 없지만, 겹치게 되면 코드가 제대로 작동하지 않는다.
// 그것을 방지하기 위해 Symbol() 처리를 통해 유니크한 값으로 설정해줄 수 있다.
// 절대 겹치지 말아야할 값들을 내가 동적으로 만들어서 사용해야할 때 심볼을 사용한다.

7. Reference type (나중에)

JavaScript Data type 정리


변수에도 Data type이 있을까

JavaScript는 변수에 값이 할당되는 시점에 Type이 결정된다.

- Type inference(타입추론) - dynamic typing(동적타이핑)

- dynamic, weak type language

- 유연한 프로그램과 효율적인 프로그램이 가능하나 신뢰도가 떨어진다.

 

dynamic typing과 반대로,

Java의 경우에는 변수에 type을 명시 (명시적 type언어, static type, Strong type)

유연하고 효율적인 프로그램은 덜하지만 신뢰도가 높다.