타입스크립트 유틸리티 타입

Record<K, T>

• K: key 타입, T: value 타입

형태

• P in K = Property in Key

type Record<K, T> = {
	[P in K]: T;
}

예시

type IFieldValue = {
	name: string;
    value: number;
};

type IFormName = 'event' | 'point'; // 타입 별칭 (string 중에서도 이 두 문자만 가능)

const x: Record<IFormName, IFieldValue> = {
	event: {
    	name: 'foo',
        value: 0,
    },
    point: {
    	name: 'bar',
        value: 1,
    }
}

Exclude<T, U>

• 유니언으로 연결된 1번째 타입에서 2번째 항의 타입을 제거(배제)

형태

type Exclude<T, U> = T extends U ? never : T;

예시

type OnlyNumber = Exclude<string|number, string>; // OnlyNumber = number 타입

Extract<T, U>

• 1번째와 2번째 타입 중 겹치는 타입만 반환 (두 타입 중 하나는 유니언으로 연결되어 있을 수 있음)

예시

type Event = {
	id: string;
    title: string;
};

type Point = {
	target: string;
    amount: number;
};

type PointInfo = Extract<Event|Point, Point>; // PointInfo는 Point 타입

Pick<T, K>

• T 타입(인터페이스)으로부터 K 프로퍼티만 추출

형태

type Pick<T, K extends keyof T> = {
	[P in K]: T[P]
};

예시

interface Event {
  	id: string;
    title: string;
  	isDone: boolean;
  	startDate: string;
};

// BaseInfo = Picked
type BaseInfo = Pick<Event, 'id' | 'title'>;
interface Picked = {
 	id: string;
  	title: string
}

Partial<T>

• 타입의 모든 프로퍼티를 optional하게 변경

형태

type Partial<T> = {
	[P in keyof T]?: T[P]
};

예시

interface UserInfo {
	age: number;
    profile: string;
    phone: string;
}

type OptionalUserInfo = Partial<UserInfo>;

// 아래와 동일
// interface UserInfo {
//	  age?: number;
//    profile?: string;
//    phone?: string;
// }

Required<T>

형태

type Required<T> = {
	[P in keyof T]-?: T[P];
};

예시

interface UserInfo {
	age: number;
    profile?: string;
    phone?: string;
}

type RequiredUserInfo = Required<UserInfo>;

// 아래와 동일
// interface UserInfo {
//	  age: number;
//    profile: string;
//    phone: string;
// }

ReadOnly<T>

형태

type ReadOnly<T> = {
	readonly [P in keyof T]: T[P]
};

예시

interface eventState {
	title: string;
    id: number;
}

const event: ReadOnly<eventState> = {
	title: 'new event',
    id: 123,
};

event.title = 'Hello'; // 값 변경 시 에러 발생

Omit<T, K>

1번째 항 타입에서 2번째 항의 프로퍼티를 생략하고 반환

형태

type Omit<T, K extends keyof any> = Pick<T, Exclude<keyof T, K>>;

예시

type Event = {
	id: number;
    title: string;
    detail: string;
};

// Event 타입에서 detail 속성 삭제
type BasicEventInfo = Exclude<keyof Event, "detail">; // { id: number, title: string }

NonNullable<T>

타입에서 null과 undefined를 제거한 타입을 반환

형태

type NonNullable<T> = T extends null | undefined ? never : T;

예시

type NotNullType = NonNullable<string | number | undefined>;
// null이나 undefined를 제거하고 반환 => NotNullType 타입은 string | number

ReturnType<T>

T 자리에 함수 또는 typeof로 가리키는 타입이 들어감
함수가 반환하는 값 또는 typeof로 연산된 타입 반환

형태

type ReturnType<T extends (...args: any) => any> = T extends (...args: any) => infer R ? R : any;

예시

type T0 = ReturnType<() => string>; // string
type T1 = ReturnType<(prev: string) => void>; // void

interface Payload {
	foo: string;
    bar: string;
}

const fooBarCreator = (): Payload = > ({
	foo: "foo",
    bar: "bar"
});

type FooBarCreator = ReturnType<typeof fooBarCreator>; // typeof fooBarCreator이 Payload 타입