Typescript | 유틸리티 타입

이동욱·2024년 2월 19일
0

유틸리티 타입

자주 사용되는 일련이 타입 변환을 수행하기 위해 미리 정의된 타입이다.

유틸리티 타입을 활용하면 코드를 간결하게 유지하고, 유지보수가 더 쉬워지며, 코드의 패턴이 명확해지는 등 여러 가지 이점이 있다.


1. Partial

주어진 타입의 모든 프로퍼티를 Optional로 만들어 준다.

type Partial<T> = {
    [P in keyof T]?: T[P];
};
type User = {
  name: string;
  age: number;
};

type Partial_User = Partial<User>;
/**
 * type User를 아래와같이 만들어 준다.
 * type User = {
 *   name?: string;
 *   age?: string;
 * }
 *
 */

2. Required

Partial과 반대로 모든 프로퍼티를 required로 만들어 준다.

type Partial<T> = {
    [P in keyof T]?: T[P];
};
type User = {
  name?: string;
  age?: number;
};

type Required_User = Required<User>
/**
 * type User를 아래와같이 만들어 준다.
 * type User = {
 *   name: string;
 *   age: string;
 * }
 * 
 */

3. Record<K, T>

키가 K타입이고, 값이 T타입인 객체 타입을 정의하는 방법이다.

type Record<K extends keyof any, T> = {
    [P in K]: T;
};
// -------- 레코드 타입 -------- 
type MenuRecord = Record<string, number>;

const menuRecord: MenuRecord = {
  hamburger: 100,
  pizza: 200,
};

// -------- 인덱스 시그니처 -------- 
type Menu = {
  [key: string]: number;
};

const menu: Menu = {
  hamburger: 100,
  pizza: 200,
};

시그니처 타입과는 다르게 키값을 리터럴 타입으로 지정할 수 있다. 그렇기 때문에 키값의 타입이 여러개인경우 사용하기 유용하다.

(인덱스 시그니처도 in을 활용하면 여러개의 타입을 key 타입으로 설정할 수 있다.)


4.Pick< T , K >

객체 타입중 에 해당하는 프로퍼티만 모아 새로운 타입을 반환한다.

type Pick<T, K extends keyof T> = {
    [P in K]: T[P];
};
type Pick_User = Pick<User, 'age'>
/**
 * type User를 아래와같이 만들어 준다.
 * type Pick_User = {
 *      age: number;
 * }
 * 
 */

5.Omit< T , K >

객체 타입중 에 해당하는 프로퍼티만 제외해 새로운 타입을 반환한다.

type Omit<T, K extends keyof any> = Pick<T, Exclude<keyof T, K>>;
type Pick_User = Omit<User, 'age'>
/**
 * type User를 아래와같이 만들어 준다.
 * type Omit_User = {
 *      name: string;
 * }
 * 
 */

6.Exclude< T , U >

유니언 타입 T중, 유니언 타입 U와 겹치는 부분을 제외하여 새로운 타입으로 반환

type Exclude<T, U> = T extends U ? never : T;
type Exlucde_User = Exclude<"a" | "b" | "c" | "d", "a" | "c">;
/**
 *  type Exlucde_User = "b" | "d"
 */
💡 Omit은 Exclude의 과정을 거쳐서 실행 된다.

7.Extract( T , U )

유니언 타입 T중, 유니언 타입 U와 겹치는 부분을 제외하여 새로운 타입으로 반환

type Extract<T, U> = T extends U ? T : never;
type Extract_User = Exclude<"a" | "b" | "c" | "d", "a" | "c">;
/**
 *  type Extract_User = "a" | "c"
 */

8.NonNullable<T>

유니언 타입에서 null과 undefined를 제외한 타입을 반환한다.

type NonNullable<T> = T extends null | undefined ? never : T;
type name = string | number | null | undefined
type NonNullable_Type = NonNullable<name>;

/**
 *  type NonNullable_Type = string | number
 */

9.Parameters

함수를 제네릭 타입으로 받아 해당 함수의 파라미터의 타입을 튜플 타입으로 반환한다

type Parameters<T extends (...args: any) => any> = T extends (...args: infer P) => any ? P : never;
function move(a: number, b: string, c: "a" | "b") { }
type Move = typeof move;
type Parameters_Move = Parameters<Move>

/**
 *  type Parameters_Move = [a: number, b: string, c: "a" | "b"]
 */

10.Parameters

함수를 제네릭 타입으로 받아 해당 함수의 파라미터의 타입을 튜플 타입으로 반환한다

type Parameters<T extends (...args: any) => any> = T extends (...args: infer P) => any ? P : never;
function move(a: number, b: string, c: "a" | "b") { }
type Move = typeof move;
type Parameters_Move = Parameters<Move>

/**
 *  type Parameters_Move = [a: number, b: string, c: "a" | "b"]
 */
profile
프론트엔드

0개의 댓글