Union Types
- 단일 타입이 아닌 다중 타입을 가질 수 있음
- | 사용하여 여러 타입 명시
let ages: number | string
ages = 15 // OK
ages = '15' // OK
type Point = { x: number, y: number }
type Loc = { lat: number, long: number }
let coordinates: Point | Loc
coordinates = { x: 4, y: 8 } // OK
coordinates = { lat: 55.2342, long: 234942.2 } // OK
Narrowing the Type (타입 좁히기)
- Union Type의 값을 특정 타입으로 확인하는 단계 추가
- typeof 구문 사용
const getPrice = (price: number | string): number => {
return price.replace('$', '') // ERROR - Property 'replace' does not exist on type 'number'
if (typeof price === 'string') {
return parseFloat(price)
} else {
return price
}
}
Array Union Type
- 배열 안에 허용되는 타입들을 괄호로 묶은 후 뒤에 대괄호 표시
// string과 number를 함께 가지는 배열
let unionArray: (string | number)[]
// string만 가지는 배열과 number만 가지는 배열
let newUnionArray: string[] | number[]
type Point = { x: number, y: number }
type Loc = { lat: number, long: number }
let position: (Point | Loc)[]
position.push({ x: 45, y: 7 }) // OK
position.push({ lat: 42342.11, long: 66.25 }) // OK
Literal Type
- 명확한 값(타입)을 갖는 변수 선언
- 해당 변수에 재할당 불가
let tempNum: 0
tempNum = 5 // ERROR - tempNum is 0 type. not 5
let tempString: 'hi'
tempString = 'hello' // ERROR - tempString is 'hi' type. not 'hello'
- Union Type을 사용하여 해당 하는 값만 받아옴
const giveAnswer = (answer: 'yes' | 'no' | 'maybe'): string => {
return `The answer is ${answer}!`
}
giveAnswer('no') // OK
giveAnswer('Love') // ERROR - answer is 'yes' or 'no' or 'maybe' type
let mood: 'HAPPY' | 'SAD' = 'HAPPY'
mood = 'SAD' // OK
mood = 'ANGRY' // ERROR
type Week = 'Monday' | 'Tuesday' | 'Wednesday'
let today: Week = 'Saturday' // ERROR