[TS]Type Annotation, Type Inference

Type Annotation

변수에 기본 타입을 할당하기 위해 변수 이름뒤에 :Type 을 추가한다.

이렇게 특정한 변수 혹은 특정한 개체 등에 어떤 타입이라고 지정해주는 일을 'Type Annotation' 이라고 한다.

let myVar: type = value

• const, let, var로 변수의 이름을 선언하고 콜론(:)과 타입을 쓴다.
• 타입은 소문자로 작성한다.
• 대부분의 경우 필요하지 않다. 실제로 변수를 작성할 때는 타입 추론(Inference)을 사용하면 된다.

let movieTitle: string = "Maze Runner";

movieTitle = "Arrival";
movieTitle = 9; // Error; Type 'number' is not assignable to type 'string'.

 

function hello(b: number) {

}
hello(39)

TypeScript는 Type Annotation을 이용하여 js코드와 달리 타입이 정확히 지정된다.

TypeScript Types VS JavaScript Types

TypeScript는 Static Types이다. 개발 도중 Type을 체크한다.

JavaScript는 Dynamic Types이다. 개발 도중엔 알 수 없고 실제 런타임에 돌입해야만 알 수 있다. 

// JavaScript
function add(n1, n2) {
  if (typeof n1 !== 'number' || typeof n2 !== 'number') {
    throw new Error('Incorrect input!');
  }
  return n1 + n2;
}
const result = add(39, 28);

// TypeScript
function add(n1: number, n2: number) {
  return n1 + n2;
}
const result = add(39, 28);

JavaScript 코드를 보면 런타임에서 에러를 체크하고 있다. 하지만 TypeScript에서는 런타임에서 체크할 필요 없이 Type annotation을 통해 number형 Type이 들어갔는 지에 대해 개발 중에 체크를 해준다.

Type Inference - 타입 추론

TypeScript은 할당된 값을 토대로 타입을 추론할 수 있다. 애너테이션이 할 일을 TS가 알아서 해주는 것이다.

하지만 애너테이션으로 직접 할당해주어야 하는 경우도 분명히 있다.

 

 

TypeScript에서는 JavaScript에서 지원하는 동일한 타입을 지원하며, 추가적인 열거 타입도 제공된다.

JavaScript 기본 자료형을 포함 (superset) - ECMAScript 표준에 따른 기본 자료형

• Boolean
• Number
• String
• Null
• Undefined
• Symbol
• Array : object 형

추가적인 TypeScript Type

• Any, Void, Never, Unknown
• Enum
• Tuple : object 형