// 유틸리티 타입
interface User {
id: number;
name: string;
age?: number;
gender?: 'm' | 'f';
}
type UserKey = keyof User; // 'id' | 'name' | 'age' | 'gender'
const uk: UserKey = 'name'; // key값 중 하나 입력!
// partial<T>
let admin1: Partial<User> = {
id: 1,
name: 'Bob',
age: 10,
// 모든 key? 상태
// job: "student", 없는 key error
};
// Required<T>
let admin2: Required<User> = {
id: 2,
name: 'Tom',
age: 10,
gender: 'f',
// ?가 필수 프로퍼티가 됨
};
// Readonly<T>
let admin3: Readonly<User> = {
id: 3,
name: 'Kate',
age: 10,
gender: 'm',
};
// admin3.id = 4; error 수정 불가
//Record<K, T> K는 key!
function isValid(user: User) {
const result: Record<keyof User, boolean> = {
id: user.id > 0,
name: user.name !== '',
age: user.age > 0,
gender: user.gender === 'm',
};
return result;
}
type Grade = '1' | '2' | '3' | '4';
type Score = 'A' | 'B' | 'C' | 'D' | 'F';
const score: Record<Grade, Score> = {
1: 'A',
2: 'B',
3: 'C',
4: 'F',
};
// Pick<T, K>
const customer1: Pick<User, "id" | "name"> = {
// 필수
id: 1,
name: "Shin",
}
// Pick<T, K>
const customer2: Omit<User, "age" | "gender"> = {
// 제외
id: 1,
name: "Shin",
}
// Exclude<T1, T2>
type T1 = string | number;
type T2 = Exclude<T1, number | boolean>; // string
// NonNullable<Type> undefined도 제외
type T3 = string | number | null | undefined;
type T4 = NonNullable<T3>; // string | number
// 그 외 유틸리티는 공식문서 참고!
https://www.youtube.com/watch?v=IeXZo-JXJjc&list=PLZKTXPmaJk8KhKQ_BILr1JKCJbR0EGlx0&index=8
728x90
'Frontend > typescript' 카테고리의 다른 글
리액트에 타입스크립트 적용 (0) | 2022.06.09 |
---|---|
Typescript 배우기 7(제네릭) (0) | 2022.06.05 |
Typescript 배우기 6 (클래스) (0) | 2022.06.05 |
Typescript 배우기 5 (리터럴, 유니온/교차 타입) (0) | 2022.06.05 |
Typescript 배우기 4 ( 함수) (0) | 2022.05.19 |