반응형
Partial<T>
- 제네릭 타입 T에 대해 기존의 타입은 유지하되, 모든 프로퍼티들을 Optional하게 변경함
type Partial<T> = {
[P in keyof T]?: T[P];
}
예제
필수 타입과 Optional 타입을 구분해서 사용해야 하는 경우에 응용하면 좋을 것 같다.
type UserInformation = RequiredUserInformation & Partial<OptionalUserInformation>;
interface RequiredUserInformation {
id: string;
uid: string;
name: string;
}
interface OptionalUserInformation {
age: number;
profile: string;
phone: string;
}
Required<T>
- Partial과 반대되는 개념
- 제네릭 타입 T에 대해 기존의 타입은 유지하되, 모든 프로퍼티에 대해 Required 속성으로 만들어줌
type Required<T> = {
[P in keyof T]-?: T[P];
};
여기서 마이너스 연산자는, Optional을 제거해준다는 의미의 연산자임.
예제
interface OptionalTodo {
id: string;
text?: string;
isDone?: boolean;
}
type Todo1 = Required<OptionalTodo>;
interface Todo2 {
id: string;
text: string;
isDone: boolean;
} // 타입 Todo1과 타입 Todo2 는 동일한 타입이다.
Record<K, T>
- 여러 Key에 동일한 interface를 지정하고 싶을 때 사용
- K: key값의 타입
- T: 값의 타입으로 갖는 타입
type Record<K, T> = {
[P in K]: T;
}
예제
type IFieldValue = {
name: string;
value: number;
};
type IFormName = 'event' | 'point';
const x: Record<IFormName, IFieldValue> = {
event: {
name: 'foo',
value: 0,
},
point: {
name: 'foo',
value: 30,
}
}
Exclude<T, U>
- T 타입에서 U 타입과 겹치는 타입을 뺌(exclude)
- 첫 번째 제너릭 타입 T 중, 두 번째 제너릭 타입 U와 겹치는 타입을 제외한 타입을 반환함
- 타입 T가 타입 U를 상속하거나 동일 타입이라면 무시(never)하고, 아닐 경우 타입을 반환함
type Exclude<T, U> = T extends U ? never : T;
예제
type OnlyNumber = Exclude<string | number, string>;
// type OnlyNumber = number;
Extract<T, U>
- T 타입에서 U 타입과 겹치는 타입만을 추출함(extract)
- 첫 번째 재너릭 타입 T에 대해 제너릭 타입 U 중, 할당 가능한 타입을 할당함
- Exclude와 반대되는 개념
type Extract<T, U> = T extends U ? T : never;
예제
type Event = {
id: string;
pw: string;
}
type Point = {
target: string;
amount: number;
}
type PointInfo = Extract<Event | Point, Point>
// PointInfo = Point
내가 원하는 프로퍼티로 구성된 타입이 이미 있을 때 사용할 수 있다.
반응형
'Front-End: Web > TypeScript' 카테고리의 다른 글
[TypeScript] type이 없는 모듈을 사용할 때 발생하는 에러 해결하기 (0) | 2023.07.30 |
---|---|
TypeError: relativeURL.replace is not a function (0) | 2023.07.22 |
Uncaught TypeError: Cannot add property current, object is not extensible (feat. forwardRef) (0) | 2023.07.22 |
[코딩애플] ts part 2-7. Generic 함수 (0) | 2022.10.28 |
[코딩애플] ts part 2-6. import export & namespace (0) | 2022.10.28 |