안녕하세요.
이번 시간에는 TypeScript의 Type 종류에 대해서 알아보겠습니다.
TypeScript에는 다음의 Type 들이 있습니다.
- number
- string
- boolean
- object
- array
- tuple
- enum
- any
- union
- literal
- unkown
- never
number
모든 정수, 실수를 포함한 모든 숫자의 타입입니다.
사용하는 방법은 num1: number 형식으로 사용합니다.
string
작은따옴표(''), 큰따옴표(""), 백틱(``)을 포함한 모든 문자열의 타입입니다.
사용하는 방법은 str1: string 형식으로 사용합니다.
boolean
True와 False를 나타내는 타입입니다.
사용하는 방법은 isChecked: boolean 형식으로 사용합니다.
object
{key: value} 형식의 타입입니다.
사용하는 방법은 다음과 같습니다.
const person: {
name: string;
age: number;
} = {
name: 'Hyukho',
age: 24
}
array
[1, 2, 3] 과 같은 값을 가지는 배열 형식의 타입입니다.
사용하는 방법은 숫자일 경우, numArray: number[] 이렇게 사용하고, 문자일 경우, stringArray: string[] 이런 형식으로 사용합니다. 또, 여러개의 타입이 섞인 배열의 경우, mixArray: any[] 이렇게 사용합니다.
tuple
배열과 비슷하나 딱 2개의 요소 하나는 숫자 하나는 문자로 지정해서 사용해야하는 타입입니다.
사용하는 방법은 role: [0, 'user'] 이렇게 숫자와 문자 하나씩 배열 형태로 사용합니다.
enum
숫자에 하나의 문자를 할당하여 여러개 지정할 때 사용하는 타입입니다.
사용하는 방법은 다음과 같습니다.
// const GUEST = 0
// const USER = 1
// const AUTHOR = 2
// const ADMIN = 3
enum Role {GUEST, USER, AUTHOR, ADMIN}
이렇게 사용하면, GUEST 는 0 으로 시작해서 USER는 1의 값을 가지고, ADMIN의 값은 3이 됩니다.
만약 GUEST를 GUEST = 3으로 할당할경우, 그 다음 USER의 값은 1이 증가한 4가 됩니다.
뿐만 아니라 값을 다르게 할당할 수 있습니다. 예를 들어 GUEST는 3의 값을, USER는 99의 값을 가지도록 하려면 다음과 같이 사용합니다.
enum Role = {GUEST = 3, USER = 99}
또한 string 값을 할당할 수도 있습니다.
enum Role {GUEST = 'GUEST', USER = 'USER', AUTHOR = 'AUTHOR', ADMIN = 'ADMIN'}
union
한가지 변수가 두개 이상의 타입을 가질 수 있을 때 사용하는 타입입니다.
사용하는 방법은 input1: number | string 이렇게 사용합니다.
literal
변수에 특정 문자열만 할당해서 사용하는 타입입니다. 예를 들어 해당 변수가 'movie' 또는 'series' 의 문자 변수만을 가질 때 다음과 같이 사용합니다. type: 'movie' | 'series'
unknown
any와 같이 어느 타입이 와도 괜찮지만 그 변수를 특정 타입으로 정의된 다른 변수에 할당하려고 할때 if 문을 통해 해당 타입을 확인한 경우에만 할당할 수 있도록 하는 타입입니다.
사용하는 방법은 다음과 같습니다.
let userInput: unknown
let userName: string
userInput = 5
userInput = 'max'
if (typeof userInput === 'string') {
userName = userInput
}
never
애플리케이션에 에러를 발생시키려는 목적으로 사용하며 아무것도 리턴하지 않는 타입입니다.
사용하는 방법은 다음과 같습니다.
function generateError(message: string, code: number): never {
throw { message: message, errorCode: code }
}
generateError('An error occurred!', 500);
이렇게 TypeScript의 Type 종류에 대해서 알아봤습니다.
유용하셨다면, 공감과 구독 부탁 드립니다.
감사합니다. :)
댓글