개발/TypeScript

[TypeScript] TypeScript의 유틸리티 타입

xuwon 2024. 12. 10. 18:44

유틸리티 타입은 타입스크립트에서 제공하는 내장 타입으로, 기존 타입을 변환하거나 새로운 타입을 생성하는 데 사용된다.
이러한 유틸리티 타입은 코드를 간결하게 작성하고 재사용성을 높이는 데 도움이 된다.

 

Partial<Type>

기존 타입의 모든 속성을 선택적으로 만드는 데 사용된다.
즉, 해당 타입의 모든 속성이 필수가 아니라 선택적이 된다.

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

// 모든 속성이 선택적인 UserPartial 타입
type UserPartial = Partial<User>;

// UserPartial 타입 사용
const partialUser: UserPartial = {};

 

Readonly<Type>

기존 타입의 모든 속성을 읽기 전용으로 만드는 데 사용된다.
즉, 해당 타입의 모든 속성을 변경할 수 없게 된다.

interface Config {
  title: string;
  subtitle: string;
}

// 모든 속성이 읽기 전용인 ReadonlyConfig 타입
type ReadonlyConfig = Readonly<Config>;

// ReadonlyConfig 타입 사용
const config: ReadonlyConfig = { title: "Hello", subtitle: "World" };
// 아래와 같이 변경을 시도하면 에러 발생
// config.title = "Hi";

 

Pick<Type, Keys>

기존 타입에서 지정된 속성(키)들만 선택하여 새로운 타입을 생성하는 데 사용된다.
이는 타입에서 필요한 일부 속성만을 추출하여 새로운 타입을 만들고자 할 때 유용하다.

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

User 인터페이스에서 idname 속성만을 선택해서 새로운 타입을 만들고자 함!

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

따라서 UserPreview 타입은 다음과 같다.

type UserPreview = {
  id: number;
  name: string;
}

 

Omit<Type, Keys>

기존 타입에서 지정된 속성들을 제외한 나머지 속성들로 새로운 타입을 생성하는 데 사용된다.
즉, Pick 유틸리티와 반대의 기능을 한다고 생각하면 된다.

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

User 인터페이스에서 idemail 속성을 제외하고 나머지 속성들만을 포함하는 새로운 타입을 만들고자 함!

type UserWithoutIdAndEmail = Omit<User, "id" | "email">;

따라서 UserWithoutIdAndEmail 타입은 다음과 같다.

type UserWithoutIdAndEmail = {
  name: string;
  age: number;
}

 

Record<Keys, Type>

지정된 키의 타입을 가진 속성을 포함하는 새로운 타입을 생성한다.

// 문자열을 키로 갖고 숫자를 값으로 가지는 객체 타입
type NumberRecord = Record<string, number>;

// NumberRecord 타입 사용
const numberRecord: NumberRecord = { one: 1, two: 2, three: 3 };

 

Parameters<Type>

함수나 메서드의 매개변수들의 타입을 추출하여 튜플 타입으로 만드는 데 사용된다.
이는 함수의 매개변수들을 추출하여 타입을 다루거나 변형할 때 유용하다.

function greet(name: string, age: number) {
  console.log(`Hello, ${name}! You are ${age} years old.`);
}

이제 이 함수의 매개변수들의 타입을 추출하여 튜플 타입으로 만들고자 함!

type GreetParameters = Parameters<typeof greet>;

따라서 GreetParameters 타입은 다음과 같다.

type GreetParameters = [string, number];