[Typescript] 타입 선언 및 종류

Jiwon Yoo·2023년 5월 30일
0

프론트엔드

목록 보기
26/38

타입스크립트는 일반 변수, 매개 변수(Parameter), 객체 속성(Property) 등에 : TYPE과 같은 형태로 타입을 지정할 수 있다.

타입 선언

문자열: String

let kim: string = 'Kim';
let myName: string = `My name is ${kim}`;

숫자: Number

let num: number = 10;

불리언: Boolean

let isDone: boolean = false;

배열: Array

let fruits: string[] = ["Apple", "Banana", "Pear"];
let oneToFive: Array<number> = [1, 2, 3, 4, 5];
let array: (string | number)[] = ["Apple", 1, 2, "Banana", 3];
let array: Array<string | number> = ["Apple", 1, 2, "Banana", 3];

튜플: Tuple

TypeScript에서 튜플 타입을 사용하면 요소의 타입과 개수가 고정된 배열을 표현할 수 있다.

let user: [string, number, boolean] = ["kimcoding", 20, true];

객체: Object

let obj: object = {};

객체의 프로퍼티 타입들을 각기 명시해 주는 것이 훨씬 좋다. 객체는 이런 방식으로 key-value에 구체적인 타입까지도 지정할 수 있다.

let user: {name: string, age: number} = {
	name: "kimcoding",
	age: 20
}

모든 타입: Any

간혹 애플리케이션을 만들 때, 알지 못하는 타입을 표현해야 할 때도 있다. 클라이언트에서 유저로부터 받은 데이터 및 서드파티 라이브러리에서 들어오는 값인 경우 개발자가 알지 못하는 타입일 수 있는데, 타입 검사를 하지 않고자 할 때 any 타입을 사용할 수 있다.

let maybe: any = 4;

열거형: Enum

TypeScript의 열거형(Enum)은 특정 값의 집합을 정의할 때 사용된다. JavaScript에서는 기본적으로 열거형을 지원하지 않지만, TypeScript에서는 문자형 열거형과 숫자형 열거형을 지원한다.

// 숫자형 열거형
enum Color {
  Red = 1,
  Green = 2,
  Blue = 4,
}

열거형은 숫자형과 문자열형, 혹은 이 둘의 조합으로 정의될 수 있다. 디폴트 값으로 숫자형을 사용하며, 각 값은 자동으로 0부터 시작하여 1씩 증가한다. 그러나 위와 같이 수동으로 값을 지정할 수도 있다.

// 문자열 열거형
enum Direction {
  Up = "UP",
  Down = "DOWN",
  Left = "LEFT",
  Right = "RIGHT",
}

문자형 열거형은 앞에서 살펴본 숫자형 열거형과 개념적으로는 거의 비슷하다. 문자형 열거형은 열거형의 값을 전부 다 특정 문자 또는 다른 열거형 값으로 초기화해야 한다.

또한 문자형 열거형에는 숫자형 열거형과는 다르게 auto-incrementing이 없다. 대신 디버깅을 할 때 숫자형 열거형의 값은 가끔 불명확하게 나올 때가 있지만 문자형 열거형은 항상 명확한 값이 나와 읽기 편하다.

profile
새싹 개발자 🌱

0개의 댓글