TypeScript | 🌹Type Aliases, Literal Types, Union Types, Intersection

권기현·2021년 2월 10일

typescript

TypeScript

목록 보기

2/3

TypeScript의 꽃🌹이라고 하는 친구들에 대해서 알아보자.

🌟1. Type Aliases

Type aliases는 타입의 새로운 이름을 만들 수 있다.
: 새로운 타입을 사용자가 정의 할 수 있다는 것.
: 새로운 유형을 생성하는 것이 아닌 해당하는 유형을 참조하는 새로운 이름(타입)을 만든다.
Primitive Type과 Objective Type 모두 정의할 수 있다.
:원시 타입의 경우에는 aliasing할 수 있지만 유용하지는 않다.

🌟🌟2. Literal Types

String, Numeric, Boolean 세 가지 유형의 Literal Types가 있다.
Literal Types를 이용하여 string, number, boolean 타입에 있어야하는 정확한(정해진) 값을 할당할 수 있다.
역할 ( Literal Narrowing )
: 어떤 변수의 타입이 'string'라면, 무한한 string타입의 문자열이 할당될 수 있다. 수많은 케이스가 존재할 수 있게되는데
무한한 케이스를 좀 더 작고 유한한 케이스로 만들 수 있다. => Union Types와 결합하여!!

2-1. String Literal Types

: 문자열을 타입으로 지정할 수 있다.
: 즉, 문자열로 지정된 타입을 가지는 변수라면 그 변수는 주어진 타입에 할당된 문자열만 할당될 수 있다.

2-2. Numeric Literal Types

: String Literal Types과 비슷하게 동작한다.

2-3. Boolean Literal Types

🌟3. Union Types

✅ TIP!⇨ OR의 개념을 생각하면 된다.

union은 하나 또는 두 가지 타입을 결합하는 기능으로서 여러 타입 중 하나 일 수 있는 값을 표현하는 방법
두개 이상의 데이터 타입을 파이프 기호 (|)를 사용하여 조합되어 union형식을 나타낸다.
주로 Literal Types와 함께 사용된다.
특정 타입으로 타입의 범위를 좁히는 것에 활용( Type guard )

🌟🌟🌟Discriminating Unions

현재 사용되는 케이스(타입)를 좁힐 수 있는 Literal types를 사용한 하나의 field를 공통적으로 가지고 있는 Unions를 통해 구현할 수 있는 기술이다.
이때 공통적으로 가지고 있는 하나의 field는 동일한 키와 다른 값을 가지고 있어야한다.

✅ POINT⇨ 어떤 케이스든, 공통된 키를 가지는 하나의 filed를 만들고 그 field에는 각 Union마다 다른 값을 가지게 해서 Union Type을 구별하기 쉽게 만든다.

직관적으로 코드를 작성할 수 있다.
가독성 있는 코드를 작성할 수 있다

( 원문으로 공식문서를 보는 것을 연습하고 있어서 의역해서 적는 것이 어렵습니다. 😭ㅜㅜ)

아래의 예를 보면 더 쉽게 이해할 수 있습니다.

위에서 말한 각각의 interface에는 "isValid" 라는 공통된 하나의 filed가 있고, 그 field는 Boolean Literal Types로 다른 값이 작성되어 있는 것을 볼 수 있습니다.