TypeScript Utility Types | Partial· Pick
이 글의 핵심
TypeScript utility types: Partial, Required, Readonly, Pick, Omit, Record, Exclude, Extract, ReturnType, Parameters—API DTOs, forms, and state patterns.
Introduction
Utility types are type transformation tools that TypeScript provides out of the box.
1. Partial
Concept
Makes every property optional.
interface User {
id: string;
name: string;
email: string;
age: number;
}
type PartialUser = Partial<User>;
// {
// id?: string;
// name?: string;
// email?: string;
// age?: number;
// }
Real-world example
function updateUser(id: string, updates: Partial<User>): User {
const user = getUser(id);
return { ...user, ...updates };
}
updateUser("U001", { name: "김철수" });
updateUser("U002", { email: "[email protected]", age: 30 });
How it works
type MyPartial<T> = {
[K in keyof T]?: T[K];
};
2. Required
Concept
Makes every property required.
interface User {
id: string;
name: string;
email?: string;
age?: number;
}
type RequiredUser = Required<User>;
// {
// id: string;
// name: string;
// email: string;
// age: number;
// }
How it works
type MyRequired<T> = {
[K in keyof T]-?: T[K];
};
3. Readonly
Concept
Makes every property read-only.
interface User {
id: string;
name: string;
email: string;
}
type ReadonlyUser = Readonly<User>;
const user: ReadonlyUser = {
id: "U001",
name: "홍길동",
email: "[email protected]"
};
// user.name = "김철수"; // ❌ Error
How it works
type MyReadonly<T> = {
readonly [K in keyof T]: T[K];
};
4. Pick<T, K>
Concept
Selects only certain properties.
interface User {
id: string;
name: string;
email: string;
age: number;
address: string;
}
type UserPreview = Pick<User, "id" | "name">;
// {
// id: string;
// name: string;
// }
const preview: UserPreview = {
id: "U001",
name: "홍길동"
};
Real-world example
type LoginForm = Pick<User, "email">;
type SignupForm = Pick<User, "name" | "email" | "age">;
How it works
type MyPick<T, K extends keyof T> = {
[P in K]: T[P];
};
5. Omit<T, K>
Concept
Removes specific properties.
interface User {
id: string;
name: string;
email: string;
password: string;
}
type UserWithoutPassword = Omit<User, "password">;
// {
// id: string;
// name: string;
// email: string;
// }
const user: UserWithoutPassword = {
id: "U001",
name: "홍길동",
email: "[email protected]"
};
Real-world example
type UserResponse = Omit<User, "password">;
type CreateUserRequest = Omit<User, "id">;
How it works
type MyOmit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
6. Record<K, T>
Concept
Builds an object type with fixed keys and a given value type.
type Role = "admin" | "user" | "guest";
type Permissions = Record<Role, string[]>;
const permissions: Permissions = {
admin: ["read", "write", "delete"],
user: ["read", "write"],
guest: [read]
};
Real-world example
type ErrorCode = "NOT_FOUND" | "UNAUTHORIZED" | "SERVER_ERROR";
type ErrorMessages = Record<ErrorCode, string>;
const errors: ErrorMessages = {
NOT_FOUND: "리소스를 찾을 수 없습니다",
UNAUTHORIZED: "인증이 필요합니다",
SERVER_ERROR: "서버 에러가 발생했습니다"
};
type Language = "ko" | "en" | "ja";
type Translations = Record<Language, Record<string, string>>;
const translations: Translations = {
ko: { greeting: "안녕하세요", goodbye: "안녕히 가세요" },
en: { greeting: "Hello", goodbye: "Goodbye" },
ja: { greeting: "こんにちは", goodbye: "さようなら" }
};
How it works
type MyRecord<K extends keyof any, T> = {
[P in K]: T;
};
7. Exclude<T, U>
Concept
Removes types from a union.
type AllRoles = "admin" | "user" | "guest" | "moderator";
type NonAdminRoles = Exclude<AllRoles, "admin">;
// "user" | "guest" | "moderator"
let role: NonAdminRoles = "user";
8. Extract<T, U>
Concept
Extracts only the members of a union that are assignable to U.
type AllRoles = "admin" | "user" | "guest" | "moderator";
type AdminRoles = Extract<AllRoles, "admin" | "moderator">;
// "admin" | "moderator"
let role: AdminRoles = "admin";
9. NonNullable
Concept
Removes null and undefined from a type.
type MaybeString = string | null | undefined;
type DefiniteString = NonNullable<MaybeString>;
// string
let value: DefiniteString = "hello";
10. ReturnType
Concept
Extracts a function’s return type.
function getUser() {
return {
id: "U001",
name: "홍길동",
email: "[email protected]"
};
}
type User = ReturnType<typeof getUser>;
11. Parameters
Concept
Extracts a function’s parameter types as a tuple.
function createUser(name: string, age: number, email: string) {
return { name, age, email };
}
type CreateUserParams = Parameters<typeof createUser>;
// [string, number, string]
const params: CreateUserParams = ["홍길동", 25, "[email protected]"];
createUser(...params);
12. Practical examples
Example 1: API typing
interface User {
id: string;
name: string;
email: string;
password: string;
createdAt: Date;
updatedAt: Date;
}
type CreateUserRequest = Omit<User, "id" | "createdAt" | "updatedAt">;
type UpdateUserRequest = Partial<Omit<User, "id" | "createdAt" | "updatedAt">>;
type UserResponse = Omit<User, "password">;
type UserListItem = Pick<User, "id" | "name" | "email">;
Example 2: Form state
interface FormField<T> {
value: T;
error: string | null;
touched: boolean;
}
type FormState<T> = {
[K in keyof T]: FormField<T[K]>;
};
interface LoginData {
email: string;
password: string;
}
type LoginFormState = FormState<LoginData>;
const form: LoginFormState = {
email: { value: "", error: null, touched: false },
password: { value: "", error: null, touched: false }
};
Example 3: App state slices
interface AppState {
user: User | null;
posts: Post[];
loading: boolean;
error: string | null;
}
type LoadingState = Pick<AppState, "loading">;
type ErrorState = Pick<AppState, "error">;
type DataState = Omit<AppState, "loading" | "error">;
Summary
Takeaways
- Partial: all properties optional
- Required: all properties required
- Readonly: all properties read-only
- Pick: select properties
- Omit: remove properties
- Record: key–value object types
- Exclude / Extract: filter unions
- ReturnType: function return type
- Parameters: function parameter tuple type
Utility types at a glance
| Type | Use case | Example |
|---|---|---|
| Partial | Optional update payloads | PATCH bodies |
| Required | Ensure completeness | Validated records |
| Pick | Subsets | List rows, previews |
| Omit | Strip secrets | Responses without password |
| Record | Fixed key sets | Roles, error catalogs |
Next steps
- [TypeScript decorators](/en/blog/typescript-series-06-decorators/
- [Advanced TypeScript patterns](/en/blog/typescript-series-07-advanced/
- [TypeScript project: REST API](/en/blog/typescript-series-08-project/
Related posts
- [TypeScript getting started | install, config, syntax](/en/blog/typescript-series-01-intro/
- [Advanced TypeScript types | unions, intersections, literals](/en/blog/typescript-series-02-types/
- [TypeScript interfaces | complete guide](/en/blog/typescript-series-03-interface/
- [TypeScript generics | complete guide](/en/blog/typescript-series-04-generics/
- [TypeScript decorators](/en/blog/typescript-series-06-decorators/
자주 묻는 질문 (FAQ)
Q. 이 내용을 실무에서 언제 쓰나요?
A. TypeScript utility types: Partial, Required, Readonly, Pick, Omit, Record, Exclude, Extract, ReturnType, Parameters—API … 실무에서는 위 본문의 예제와 선택 가이드를 참고해 적용하면 됩니다.
Q. 선행으로 읽으면 좋은 글은?
A. 각 글 하단의 이전 글 또는 관련 글 링크를 따라가면 순서대로 배울 수 있습니다. C++ 시리즈 목차에서 전체 흐름을 확인할 수 있습니다.
Q. 더 깊이 공부하려면?
A. cppreference와 해당 라이브러리 공식 문서를 참고하세요. 글 말미의 참고 자료 링크도 활용하면 좋습니다.
같이 보면 좋은 글 (내부 링크)
이 주제와 연결되는 다른 글입니다.
- [TypeScript Generics | Complete Guide](/en/blog/typescript-series-04-generics/
- [TypeScript Decorators](/en/blog/typescript-series-06-decorators/
- [Advanced TypeScript | Conditional Types· Template Literals](/en/blog/typescript-series-07-advanced/
이 글에서 다루는 키워드 (관련 검색어)
TypeScript, Utility Types, Partial, Pick, Omit, Record, Mapped Types 등으로 검색하시면 이 글이 도움이 됩니다.