TypeScript 주요 유틸리티 타입 정리

1. 들어가기

TypeScript는 자바스크립트의 확장언어로서 정적 타입 체계를 제공합니다.

이 타입 시스템을 더욱 강력하게 활용할 수 있도록, TypeScript는 유틸리티 타입(Utility Types) 이라는 여러 빌트인 타입 도구를 제공합니다.

유틸리티 타입을 사용하면 기존 타입을 기반으로 새로운 타입을 손쉽게 생성하거나 변환할 수 있어, 반복적인 타입 선언을 줄이고 더 견고한 코드를 작성할 수 있습니다.

이 글에서는 실무에서 자주 활용되는 TypeScript의 주요 유틸리티 타입들에 대해 알아보겠습니다.

---

2. Partital<T> 부분 타입 만들기

Partial<T>는 객체 타입 T의 모든 속성을 선택적(Optional) 으로 만들어주는 유틸리티 타입입니다.즉, 원래 T에서 필수(required)였던 속성들도 Partial<T>를 적용하면 모두 ?(optional)로 변환되어, 해당 속성들을 선택적으로 가질 수 있는 새로운 타입이 됩니다. 이 타입은 주로 객체의 일부 속성만 업데이트하거나 부분적인 데이터만 다룰 때 유용합니다.

2.1. 사용 예시

interface User {
  id: number;
  name: string;
  email: string;
}

type PartialUser = Partial<User>;
// PartialUser 타입: { id?: number; name?: string; email?: string }

let userOhhaio: PartialUser = { name: "ohhaio" };
userOhhaio.email = "ohhaio@example.com";  // email 속성 추가도 가능 (선택적 속성)

위 코드에서 PartialUser는 User의 모든 속성이 optional로 바뀐 타입입니다.

따라서 userOhhaio 객체를 생성할 때 name만 제공하거나, 이후에 email을 나중에 추가하는 등 일부 속성만 가지고 있어도 타입 오류가 발생하지 않습니다.

2.2. 실무 활용

function updateUser(id: number, updates: Partial<User>) {
  // ... 데이터베이스에서 id에 해당하는 사용자 불러오기
  // ... 제공된 필드만 업데이트
}

// 사용 예시:
updateUser(1, { email: "new-email@example.com" });
// 이름은 변경하지 않고 email만 부분적으로 업데이트

위처럼 updateUser 함수는 객체에 User의 일부 속성만 있어도 동작하며, 존재하지 않는 속성을 업데이트하려 하면 컴파일 타임에 오류를 잡아줍니다.

---

3. Required<T> - 모든 속성 필수화

equired<T>는 객체 타입 T의 모든 속성을 필수(required) 로 만드는 유틸리티 타입입니다. T에서 optional(?)로 선언된 속성이 있었다면, Required<T>에서는 그 속성들까지 모두 반드시 정의되어야 하는 속성으로 바뀝니다. 즉, 부분적으로 생략될 수 있었던 필드들까지 포함하여 완전한 객체 형태를 요구할 때 사용하는 타입입니다.

3.1. 사용 예시

interface Person {
  name: string;
  age?: number;  // age는 선택적 속성
}

type CompletePerson = Required<Person>;
// CompletePerson 타입: { name: string; age: number; }

const p: CompletePerson = { name: "ohhaio", age: 30 }; 
const p: CompletePerson = { name: "ohhaio" }; // ❌ 모든속성을 제공해야함. age 가 없어 에러 발생

위 예시에서 Person의 age는 원래 optional이지만, CompletePerson에서는 age: number로 필수 속성이 됩니다.

따라서 객체 p를 만들 때 age를 누락하면 타입 오류가 발생합니다.

3.2. 실무 활용

Required는 Partial로 부분적으로 채워진 객체를 완전히 다 채워진 형태로 다룰 때 유용합니다.

예를 들어, 일부 필드만 채워진 임시 객체를 만들었다가 최종적으로 모든 필드를 채운 후에는 Required 타입으로 다루면 타입 시스템이 모든 값이 존재함을 보장해줍니다.

또한, API 응답 객체 등에서 선택적 필드들이 모두 실제로 존재하는 상황에서, 코드 상에서 이를 타입으로 명시하여 방어적으로 쓰이기도 합니다.

---

4. Readonly<T> - 불변 객체 타입

Readonly<T>는 객체 타입 T의 모든 속성을 읽기 전용(read-only) 으로 만들어주는 유틸리티 타입입니다. 이렇게 만들어진 타입의 프로퍼티는 재할당(수정)이 불가능하며, 한번 값이 설정되면 변경하려 하면 컴파일 오류가 발생합니다. 불변 객체를 구현하거나, 함수에 전달된 객체가 내부에서 변경되지 않도록 보호할 때 사용합니다.

4.1. 사용 예시

interface Point { 
  x: number; 
  y: number; 
}

const pt: Readonly<Point> = { x: 10, y: 20 };
pt.x = 5;  
// 오류: Readonly<Point> 타입에서 x는 읽기 전용이므로 값을 변경할 수 없음

위 코드에서 pt 객체는 Point 타입의 읽기 전용으로 선언되었습니다. pt의 각 속성(x, y)에 새로운 값을 할당하려고 하면 컴파일러가 에러를 발생시켜, 원본 데이터를 유지하도록 강제합니다.

4.2. 실무 활용

함수에 객체를 인자로 전달할 때 Readonly를 사용하면 해당 객체를 함수 내부에서 수정할 수 없도록 만들 수 있습니다.

예를 들어, 설정 객체를 처리하는 함수에 Readonly 타입을 적용하면 함수 구현 중에 설정을 변경하려는 시도를 컴파일 시점에 방지할 수 있습니다.

interface Config { 
  readonly url: string; 
  timeout: number; 
}
function processConfig(config: Readonly<Config>) {
  // config.timeout = 1000;  // ❌ config는 읽기 전용으로 처리됨
  // ... 설정 값을 읽어서 처리만 하고 수정은 하지 않음
}

위 코드에서 processConfig 함수는 Config 객체를 읽기만 하고 변경하지 않을 것임을 타입으로 명시했습니다. 이처럼 Readonly를 활용하면 불변성(immutability) 을 보장하여 사이드 이펙트를 줄이는 코드 작성이 가능합니다.

---

5. Pick<T, K> - 일부 속성만 선택

Pick<T, K>는 객체 타입 T에서 일부 속성들만 골라 새로운 타입을 정의할 때 사용하는 유틸리티 타입입니다. 두 번째 제네릭 매개변수 K에는 가져오고자 하는 속성 이름들의 유니온(union)을 지정합니다. 결과적으로 T에서 K에 해당하는 속성들만 가진 축소된 형태의 타입을 얻을 수 있습니다.

5.1. 사용 예시

interface User {
  id: number;
  name: string;
  email: string;
  age: number;
}

type UserNameEmail = Pick<User, "name" | "email">;
// UserNameEmail 타입: { name: string; email: string; }

const user: User = { id: 1, name: "ohhaio", email: "ohhaio@example.com", age: 25 };

const contact: UserNameEmail = { name: user.name, email: user.email };
const contact: UserNameEmail = { name: user.name, email: user.email, age: user.age }; // ❌ 에러발생 : Pick 유틸리티 타입을 통해 name, email 만 선언 가능
// contact는 name과 email 정보만을 갖는다

위 코드에서는 User에서 "name"과 "email" 속성만 선택하여 UserNameEmail 타입을 만들었습니다. 이렇게 생성된 타입을 사용하면, User의 부분 집합인 속성들만 포함하도록 컴파일러 수준에서 제한할 수 있습니다.

5.2. 실무 활용

Pick은 주로 대상 객체에서 일부 필드만 필요할 때 유용합니다.

예를 들어, 전체 User 정보에서 화면에 표시할 간략한 정보(예: 이름과 이메일)만 필요하다면 Pick을 통해 해당 부분 타입을 정의할 수 있습니다.

또는 하나의 거대한 타입에서 특정 섹션과 관련된 필드들만 모아 새로운 타입을 만들 때도 활용됩니다.

// 예: User 객체에서 프로필 표시용 정보 타입 추출
interface User {
  id: number;
  name: string;
  email: string;
  age: number;
}

type UserProfile = Pick<User, "id" | "name" | "email">;

function showUserProfile(u: User): UserProfile {
  return { id: u.id, name: u.name, email: u.email };
}

위 코드 처럼 UserProfile 타입을 Pick으로 정의하면, showUserProfile 구현에서 해당 속성들만 반환하고 다른 속성을 반환하려 하면 컴파일 오류가 발생하므로, 의도치 않은 데이터 노출을 방지할 수 있습니다.

---

6. Omit<T, K> - 일부 속성 생략

Omit<T, K>는 객체 타입 T에서 특정 속성들(K)을 제거하여 새로운 타입을 만드는 유틸리티 타입입니다. 즉, T의 모든 속성 중에서 K로 지정된 속성들을 생략(omit) 하고 남은 속성들로 타입을 정의합니다. 결과적으로 Pick과 반대되는 동작을 하며, 기존 타입에서 몇몇 속성을 빼고 나머지를 취하는 상황에서 유용합니다.

6.1. 사용 예시

interface User {
  id: number;
  name: string;
  email: string;
  password: string;
}

type PublicUser = Omit<User, "password">;
// PublicUser 타입: { id: number; name: string; email: string; }

const fullUser: User = { id: 1, name: "Alice", email: "alice@example.com", password: "secret" };
const publicData: PublicUser = {
  id: fullUser.id,
  name: fullUser.name,
  email: fullUser.email
};
// password 속성은 제외된 상태

위에서 PublicUser 타입은 User에서 "password" 속성을 제거한 형태입니다. PublicUser를 사용하면 비밀번호를 포함하지 않은 사용자 정보만 다루도록 강제할 수 있습니다.

6.2. 실무 활용

Omit은 민감 정보나 필요 없는 정보를 타입에서 제거할 때 많이 사용됩니다.

예를 들어, 데이터베이스 모델 객체 User가 password나 salt와 같은 민감한 정보를 포함하고 있을 때, 이를 제외한 공용 DTO를 정의하는 경우 Omit을 활용할 수 있습니다.

// 비밀번호를 제외한 사용자 응답용 DTO 타입 정의
type UserResponseDto = Omit<User, "password" | "salt">;

function toUserResponse(user: User): UserResponseDto {
  const { password, salt, ...rest } = user;
  return rest;  // password와 salt가 제거된 객체를 반환
}

위 코드처럼 UserResponseDto 타입을 사용함으로써 함수 toUserResponse는 password와 salt를 반환 대상에서 자동으로 제외하며, 실수로 해당 필드를 반환하려 하면 컴파일러가 잡아줍니다. 이처럼 Omit을 통해 제외되어야 할 필드를 명시함으로써 보다 안전한 데이터 처리를 할 수 있습니다.

---

7. Record<K, T> - 키-값 맵핑 타입 생성

Record<K, T>는 키 집합 K와 값 타입 T를 조합하여 새로운 객체 타입을 생성하는 유틸리티 타입입니다. 여기서 K는 키로 사용할 문자열/숫자/심볼들의 유니온이고, T는 모든 키가 가져야 할 값의 타입입니다. 결과 타입은 주어진 모든 키 K를 속성으로 가지며, 각 속성의 값이 T 타입인 객체 형태가 됩니다. 이 유틸리티는 맵(map)이나 딕셔너리 객체의 타입을 정의할 때 유용합니다.

7.1. 사용 예시

type Page = "home" | "about" | "contact";
interface PageInfo {
  title: string;
}

const nav: Record<Page, PageInfo> = {
  home:   { title: "Home" },
  about:  { title: "About Us" },
  contact:{ title: "Contact" }
};
// nav는 Page 타입 키들을 모두 갖고, 각 값은 PageInfo 타입이다

위 코드에서 Page는 페이지 이름들의 유니온이고, PageInfo는 각 페이지의 정보 구조입니다. Record<Page, PageInfo>를 사용하면 nav 객체가 "home", "about", "contact" 세 가지 속성을 모두 가지며 각각 PageInfo 형태의 값을 갖도록 컴파일러에서 강제합니다. 만약 nav에 키 중 하나라도 빠지거나 잘못된 키를 추가하려 하면 에러가 발생합니다.

7.2. 실무 활용

Record는 일정한 키 집합에 대해 동일한 형태의 데이터를 맵핑하는 경우에 자주 사용됩니다.

예를 들어, 권한 설정을 나타내는 객체에서 사용자 역할(role)을 키로, 권한 값(boolean)을 값으로 가지도록 정의 등을 생각할 수 있습니다.

type Role = "admin" | "user" | "guest";
type Permissions = { access: boolean; edit?: boolean };

const rolePermissions: Record<Role, Permissions> = {
  admin: { access: true, edit: true },
  user:  { access: true, edit: false },
  guest: { access: false }
};
// rolePermissions 객체는 Role의 모든 키를 가지고 각 값은 Permissions 타입이다

---

8. ReturnType<F> - 함수 반환 타입 추출

ReturnType<F>는 함수 타입 F의 반환 타입을 추론하여 얻는 유틸리티 타입입니다. F에는 함수 타입 자체 (또는 함수의 typeof 타입)을 전달하며, 그 결과로 해당 함수가 반환하는 값의 타입을 얻을 수 있습니다. 이 유틸리티를 사용하면 기존 함수의 반환 타입을 재사용하거나, 함수의 반환에 따라 동적으로 타입을 결정할 수 있습니다.

8.1. 사용 예시

function add(x: number, y: number) {
  return x + y;
}
type SumReturnType = ReturnType<typeof add>;
// SumReturnType 타입: number

function createUser(name: string) {
  return { id: 1, name };
}
type NewUser = ReturnType<typeof createUser>;
// NewUser 타입: { id: number; name: string; }

첫 번째 예시에서 add 함수의 반환 타입은 number인데, ReturnType<typeof add>를 통해 이를 추출하여 SumReturnType으로 지정했습니다.

두 번째 예시에서는 객체를 반환하는 createUser 함수의 반환 타입 { id: number; name: string; }을 NewUser 타입으로 얻었습니다. ReturnType을 사용하면 이러한 반환 객체의 구조를 중복 정의하지 않고도 타입으로 활용할 수 있습니다.

8.2. 실무 활용

ReturnType은 다른 함수의 반환 결과를 받는 변수나 함수의 타입을 지정할 때 특히 유용합니다.

예를 들어, 어떤 API 호출 함수가 복잡한 객체를 반환한다면, 그 반환 객체를 가공하는 다른 함수에서 ReturnType으로 해당 타입을 받아 사용하면 원본 함수의 반환 구조와 항상 일치하는 타입을 유지할 수 있습니다.

// 예: API 응답을 가져오는 함수 (가정)
async function fetchUserData(userId: string) {
  // ... API call
  return { id: userId, name: "ohhaio", email: "ohhaio@example.com" };
}

// fetchUserData의 반환 타입을 기반으로 처리 함수 작성
function processUserData(data: ReturnType<typeof fetchUserData>) {
  // data는 { id: string; name: string; email: string; } 타입으로 취급
  console.log(`User ${data.name} has email ${data.email}`);
}

위 코드에서 processUserData는 fetchUserData의 반환 타입을 직접 명시하지 않고 ReturnType<typeof fetchUserData>로 받아옴으로써, 추후 fetchUserData의 반환 구조가 바뀌더라도 processUserData 내의 타입 정의는 자동으로 업데이트됩니다. 이처럼 ReturnType을 사용하면 타입 추론을 재활용하여 유지보수성을 향상시킬 수 있습니다.

---

9. Parameters<F> - 함수 매개변수 타입 추출

Parameters<F>는 함수 타입 F의 매개변수 타입들을 튜플(tuple) 로 추출하는 유틸리티 타입입니다. 즉, 함수의 인자들의 타입을 순서대로 담은 튜플 타입을 반환합니다. 이를 통해 함수의 인자 목록 타입을 다른 곳에서 재사용하거나 동적으로 활용할 수 있습니다.

9.1. 사용 예시

function multiply(a: number, b: number) {
  return a * b;
}
type MulParams = Parameters<typeof multiply>;
// MulParams 타입: [number, number]

function logMessage(message: string, verbose?: boolean) { /* ... */ }
type LogParams = Parameters<typeof logMessage>;
// LogParams 타입: [string, (boolean | undefined)?]

multiply 함수의 매개변수는 (a: number, b: number)이며, Parameters<typeof multiply>를 사용하면 [number, number] 튜플 타입을 얻습니다. 선택적 매개변수나 기본값이 있는 경우에도 그 타입이 튜플에 반영되며, 두 번째 logMessage 함수의 예시에서 볼 수 있듯이 verbose가 선택적이면 튜플 타입에 (boolean | undefined)? 형태로 표시됩니다.

9.2. 실무 활용

Parameters는 함수의 인자를 다른 함수로 전달하거나 함수 시그니처를 래핑(wrapping)할 때 유용합니다.

예를 들어, 기존 함수의 인자를 받아서 부가적인 처리를 한 뒤 다시 그 함수를 호출하는 고차 함수나 데코레이터를 만들 때 원 함수의 매개변수 타입을 Parameters로 받아 사용하면 편리합니다.

function callWithLogging<F extends (...args: any[]) => any>(
  fn: F, ...args: Parameters<F>
): ReturnType<F> {
  console.log("Calling function with args:", args);
  return fn(...args);
}

// 사용 예:
function greet(name: string, age: number) { return `Hello ${name}, age ${age}`; }
const message = callWithLogging(greet, "ohhaio", 30);
// 콘솔: Calling function with args: ["ohhaio", 30]
// message 타입은 ReturnType<typeof greet>, 즉 string

위 코드 callWithLogging 함수는 임의의 함수 fn과 그 인자들을 받아서, 호출 전에 로그를 남기고 결과를 반환합니다.

이때 ...args: Parameters<F>와 ReturnType<F>를 사용함으로써 callWithLogging이 전달된 함수의 시그니처를 그대로 따라가도록 구현했습니다. 이러한 패턴은 함수 조합이나 공통 처리 로직 구현 시 유용하게 쓰입니다.

---

10. Exclude<T, U> - 유니온 타입에서 제거

Exclude<T, U>는 유니온 타입 T에서 특정 타입 U에 할당 가능한 모든 요소를 제거하는 유틸리티 타입입니다. 집합 연산으로 비유하자면 T와 U의 차집합에 해당하는 타입을 얻는 것입니다. 즉, T가 여러 타입의 유니온일 때 그 중 U와 겹치는 타입들을 제외하고 남은 타입들로 새로운 유니온을 만들어줍니다.

10.1. 사용 예시

type Primitive = string | number | boolean;
type NonString = Exclude<Primitive, string>;
// NonString 타입: number | boolean

type T = string | null | undefined;
type NonNull = Exclude<T, null | undefined>;
// NonNull 타입: string

첫 번째 예시에서는 Primitive 유니온에서 string 타입을 제외하여 number | boolean만 남겼습니다.

두 번째에서는 T 유니온에서 null과 undefined를 제거하여 string 타입만 남기는 결과를 확인할 수 있습니다 (Exclude<T, null|undefined>는 아래 소개할 NonNullable<T>과 동일합니다).

10.2. 실무 활용

Exclude는 특정 케이스를 타입에서 제거하여 좁은 타입을 얻고 싶을 때 활용됩니다.

예를 들어, 문자열이나 숫자를 받을 수 있는 API에서 문자열은 이미 처리되었고 이제 숫자만 처리하고 싶다면, Exclude<string | number, string>을 사용해 숫자 타입만 남길 수 있습니다.

또한 유니온 타입에서 한두 개의 요소만 빼고 싶을 때 일일이 새로운 유니온을 작성하는 대신 Exclude를 쓰면 편리합니다.

type ResponseType = "success" | "error" | "redirect";
type ErrorOnly = Exclude<ResponseType, "success" | "redirect">;
// ErrorOnly 타입: "error"

위 코드처럼 ResponseType 유니온에서 성공과 리다이렉트 타입을 제외하면 "error"만 남게 되어, 에러에 대한 경우만 다루는 타입을 쉽게 정의할 수 있습니다.

---

11. Extract<T, U> - 유니온 타입에서 추출

Extract<T, U>는 유니온 타입 T에서 특정 타입 U에 할당 가능한 요소들만 추출하여 새로운 유니온을 구성하는 유틸리티 타입입니다. 이는 Exclude의 반대 개념으로, T와 U의 교집합에 해당하는 타입만 남긴다고 볼 수 있습니다.

11.1. 사용 예시

type Mixed = string | number | null;
type StringsOnly = Extract<Mixed, string | null>;
// StringsOnly 타입: string | null

interface Car { wheels: 4; }
interface Bike { wheels: 2; }
type Vehicle = Car | Bike;
type FourWheeler = Extract<Vehicle, { wheels: 4 }>;
// FourWheeler 타입: Car

첫 번째 예시에서는 Mixed 유니온에서 string | null에 해당하는 부분만 추출하여 string | null을 얻었고, 두 번째 예시에서는 Vehicle 유니온 타입에서 { wheels: 4 } 구조와 호환되는 Car만 뽑아냈습니다.

이렇듯 Extract를 사용하면 유니온 타입에서 원하는 형태의 타입만 걸러낼 수 있습니다.

11.2. 실무 활용

Extract는 다양한 타입이 섞인 유니온에서 특정 타입들만 골라내어 처리하고 싶을 때 유용합니다.

예를 들어, 이벤트 시스템에서 이벤트 객체들의 유니온 타입이 있다고 하면, 특정 이벤트에만 해당하는 객체 타입을 추출하여 전용 핸들러의 타입으로 사용할 수 있습니다.

혹은 여러 가능한 반환 타입 중에서 특정 인터페이스를 구현한 타입들만 모아서 새로운 유니온을 만들 때도 활용할 수 있습니다. Exclude와 마찬가지로 조건부 타입을 활용한 도구로, 필요한 타입만 선별함으로써 타입 검증을 강화해줍니다.

---

12. NonNullable<T> - Null/Undefined 제거

NonNullable<T>는 타입 T에서 null과 undefined를 제거하는 유틸리티 타입입니다. 이는 Exclude<T, null | undefined>와 동일한 동작을 하며, T에 null이나 undefined가 포함되어 있을 경우 그 부분을 제외한 타입을 반환합니다. 주로 선택적 필드나 Nullable 타입에서 실제 값 타입만 취하고 싶을 때 사용합니다.

12.1. 사용 예시

type MaybeString = string | null | undefined;
type DefinitelyString = NonNullable<MaybeString>;
// DefinitelyString 타입: string

interface User {
  id: string;
  phone?: string | null;
}
type NonNullPhoneUser = {
  id: string;
  phone: NonNullable<User["phone"]>;
};
// NonNullPhoneUser: phone에서 null과 undefined가 제거되어 string만 남음

위 첫 번째 예시에서 MaybeString에 포함된 null과 undefined가 제거되어 DefinitelyString은 string 타입이 됩니다.

두 번째 예시에서는 User 인터페이스의 phone 속성이 선택적으로 null일 수 있는 타입인데, NonNullable<User["phone"]>를 통해 null을 제거함으로써 phone이 있을 경우 문자열임을 명확히 한 새로운 타입을 정의했습니다.

12.2. 실무 활용

NonNullable은 Nullable(Null 또는 Undefined일 수 있는) 타입을 다룰 때 특히 유용합니다.

예를 들어, 함수의 반환 타입이 T | null인 경우 null이 아닌 상황에서 그 값을 다른 변수에 담아 사용할 때, 해당 변수의 타입을 NonNullable<T>로 지정하여 null이 아님을 표현할 수 있습니다.

또한 API 응답 등의 타입 정의에서 null 가능성을 없애거나, Optional한 속성을 가진 타입에서 실제 값이 존재한다고 가정하고 처리할 때 유용하게 쓰입니다.

NonNullable을 사용하면 실수로 null을 다루지 않은 채 넘어가는 것을 방지하고, 타입 안정성을 높일 수 있습니다.

13. 기타 유틸리티 타입

이 외에도 TypeScript 에는 다양한 유틸리티 타입들을 제공합니다.

• Awaited<T> – Promise와 같은 thenable 객체의 결과 타입을 추출합니다.
• ConstructorParameters<F> – 생성자 함수 타입 F의 매개변수들을 튜플로 얻습니다.
• OmitThisParameter<F>, ThisParameterType<F> – 함수 타입에서 this 타입을 제거하거나 추출할 때 사용합니다.

이러한 특수한 유틸리티 타입들은 특정 상황에서 사용되기 때문에 자세히 다루지 않았지만 공식문서에서 관련 내용들을 참고 해 보면 좋을것 같습니다.

마무리

정리 하며 보니 생각보다 Typesciprt에는 유틸리티 타입들이 많은 느낌입니다. 억지로 외우려고 하기보다는 역시 자주 사용해 보는게 가장 빠르게 기억 할 수 있는것 같습니다.

감사합니다!