1. 타입스크립트가 객체 타입 리터럴의 타입을 해석하는 방법
기존 객체에서 타입을 추론하게 하는 것도 좋지만, 가끔 명시적으로 객체 타입을 선언하고 싶을 때가 있을 것이다.
객체 타입은 객체 리터럴과 유사하지만, 필드 값 대신 타입을 사용해 설명한다는 특징이 있다.
1) 별칭 객체 타입
[덕 타이핑 참고하기 좋은 글]
https://velog.io/@thms200/Typescript-Duck-Typing-%EB%8D%95%ED%83%80%EC%9D%B4%ED%95%91
2. 중첩과 선택적 속성을 포함한 객체 리터럴 타입 소개
- 중첩 {...}
여기서의 중첩의 의미는 교집합이 아니다. 뎁스 안의 뎁스 안의 뎁스....이렇게 객체 안의 객체(또는 배열) 안의 객체(또는 배열)을 의미하는 것이다.
- 선택적 속성 : ?
3. 객체 리터럴 타입의 유니언 타입 선언, 추론 및 타입 내로잉
4. 판별된 유니언 타입과 판별값
type Pages = {
name: string;
pages: number;
type: 'pages';
}
type Rhymes = {
name: string;
rhymes: boolean;
type: 'rhymes';
}
type Poem = Pages | Rhymes;
//두 타입이 모두 될 수 있는 객체
//type 속성으로 어느 타입인지를 나타낸다.
const poem: Poem = Math.random() > 0.5
? {name: 'Hello', pages: 1, type: 'pages'}
: {name: 'World', rhymes: false, type: 'rhymes'}
if(poem.type === 'pages'){
console.log(poem.pages)
}
if(poem.type === 'rhymes'){
console.log(poem.rhymes)
}
- type Poem : 판별된 유니언
- 판별값 : 객체의 타입을 가리키는 속성 (type = 'pages' | type='rhymes')
- 이 판별값으로 타입 내로잉을 하여 값에 존재하는 속성을 보장한다.
- 따라서 if문에서 오류가 발생하지 않는 것을 알 수 있다.
poem.type; // 유니언 타입 'pages' | 'rhymes'
5. 교차 타입으로 객체 타입을 결합하는 방법
& : 교차 타입
type Artwork = {
genre: string;
name: string;
}
type Writing = {
pages: number;
name: string;
}
type WriiternArt = Artwork & Writing;
/*
{
name: string;
genre: string;
pages: number;
}
*/
WritternArt 타입은 Artwork 타입과 Writing 타입을 합친것과 같다. (합집합)
교차 타입은 유니언 타입과 결합할 수 있다.
이는 하나의 타입으로 판별된 유니언에서 유용하게 사용할 수 있다.
'Frontend > Typescript' 카테고리의 다른 글
러닝 타입스크립트 - 3장. 유니언과 리터럴 (0) | 2023.07.04 |
---|---|
러닝 타입스크립트 - 2장. 타입 시스템 (0) | 2023.07.01 |
아이템 16. number 인덱스 시그니처보다는 Array, 튜플, ArrayLike 사용하기 (0) | 2023.04.23 |
아이템 15. 동적 데이터에 인덱스 시그니처 사용하기 (0) | 2023.04.22 |
아이템14. 타입 연산과 제네릭 사용으로 반복 줄이기 (0) | 2023.04.22 |