Javascirpt, Typescript

ts 공부하기) 타입 애너테이션

DevOhwa 2022. 12. 29. 08:57
반응형

vscode로 진행하거나 typescriptlang.org에서 제공하는 playground 로 가면 타입스크립트를 이용할 수 있다. 

 

Type Annotation

타입스크립트는 상당히 직관적인데, 변수이름뒤에 콜론(:)을 적고 타입을 적어주면 된다. 

//Declaring a variable in JS
const awesomeVariable = 'WOW';

//Declaring a variable in TS
const awesomeVariable: string = 'WOW';

타입스크립트에게 'WOW'가 뭔지 알려주는거라고 생각하면 쉽다. 

타입은 등호 왼쪽에 써주며 숫자, 불리언, 문자열이나 undefined 등 원하는것을 쓰면 된다. 

 

 

String 

string타입을 사용할때는 언제나 소문자여야한다. 

아래 작은 예시들을 보자

 

let movieTitle: string = "Amadeus";
movieTitle = "Arrival";
movieTitle = 9;
movieTitle을 문자열로 작성하면 맨아랫줄
movieTitle = 9; 는 아래 캡쳐와같이 빨간줄과 숫자타입은 문자열 타입에 배정할 수 없다는 경고문구를 볼 수 있다. 

 

이렇듯 타입스크립트는 우리가 지정한 타입과 다른걸 쓰면 오류가 있음을 알려준다. 

 

다른 간단한 예시도 보자

위처럼 upper은 안되지만 toUpperCase()는 가능하다. 또한 오타가 나도 타입스크립트는 빨간줄로 알려준다.