230727 TypeScript Utility Types

💡 TypeScript는 일반적인 타입 변환을 쉽게 하기 위해서 몇 가지 유틸리티 타입을 제공한다. 이러한 유틸리티는 전역으로 사용 가능하다.

1. Partial<Type>

• Partial<Type> 타입은 타입 T의 모든 속성을 선택적으로 만든다.
• 이를 통해 기존 타입의 일부 속성만 제공하는 객체를 쉽게 생성할 수 있다.

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

const updatePerson = (person: Person, fields: Partial<Person>): Person => {
  return { ...person, ...fields };
};

const person: Person = { name: "Spartan", age: 30 };
const changedPerson = updatePerson(person, { age: 31 });

• updatePerson 함수는 두번째 인자로 Partial<Person> 타입의 fields를 받고 있다.
• 이때 이 field라는 인자는 name 속성 age 속성 name, age 속성 둘 다 가질 수 있다.
• 하지만 기존에 없는 속성은 가질 수 없다.
• 이처럼 Partial<Type> 타입은 유연하게 타입의 속성을 선택해서 객체로 만들 수 있다.

2. Required<Type>

• Required<Type> 타입은 타입 T의 모든 속성을 필수적으로 만든다.
• 즉, T 타입 객체에 정의된 모든 속성이 반드시 전부 제공 되는 객체를 생성할 때 쓰인다.

interface Person {
  name: string;
  age: number;
  address?: string; 
}

• address 뒤에 있는 ? 는 선택적 속성임을 의미한다.
• 그러나 address를 필수적으로 받아야 하는 제약사항이 있다면 Required<Type> 타입을 이용하여 다음과 같이 객체를 생성할 수 있다.

type RequiredPerson = Required<Person>;

• 이처럼 Required<Type> 타입을 통해 선언하면 address 입력도 필수적 속성으로 바꿀 수 있다.

3. Readonly<Type>

• Readonly<Type> 타입은 타입 T의 모든 속성을 읽기 전용(read-only)로 만든다.
• 이를 통해 readonly 타입의 속성들로 구성된 객체가 아니어도 완전한 불변 객체로 취급할 수 있다.

interface DatabaseConfig {
  host: string;
  readonly port: number; // 인터페이스에서도 readonly 타입 사용 가능
}

const mutableConfig: DatabaseConfig = {
  host: "localhost",
  port: 3306,
};

const immutableConfig: Readonly<DatabaseConfig> = {
  host: "localhost",
  port: 3306,
};

mutableConfig.host = "somewhere";
immutableConfig.host = "somewhere"; // 오류!

• DatabaseConfig 가 가지는 두가지 속성 중 port만 readonly 이기 때문에 DatabaseConfig는 불변 객체라고 할 수 없다.
• 하지만 Readonly<Type> 타입을 사용하여 Readonly<DatabaseConfig>로 만들어준 immutableConfig은 불변 객체이다.
• 이처럼 Readonly<Type> 타입은 불변으로 객체를 상수화시킬 수 있다.

4. Pick<Type,Keys>

• Pick<Type,Keys> 타입은 타입 T에서 K 속성들만 선택해서 새로운 타입을 만든다.
• 이를 통해 타입의 일부 속성만 포함하는 객체를 생성할 수 있다.

interface Person {
  name: string;
  age: number;
  address: string;
}

type SubsetPerson = Pick<Person, "name" | "age">;

const person: SubsetPerson = { name: "Spartan", age: 30 };

• SubsetPerson 은 Person이라는 인터페이스에서 name age 속성만 선택해서 구성된 새로운 타입이다.

5. Omit<Type,Keys>

• Omit<Type,Keys> 유틸리티 타입은 타입 T에서 K 속성들만 제외한 새로운 타입을 만든다.
• 이를 통해 기존 타입에서 특정 속성을 제거한 새로운 타입을 생성할 수 있다.

interface Person {
  name: string;
  age: number;
  address: string;
}

type SubsetPerson = Omit<Person, "address">;

const person: SubsetPerson = { name: "Alice", age: 30 };

• SubsetPerson 타입은 Person 타입에서 address 속성만 제외한 새로운 타입이다.

이 외에 다양한 유틸리티 타입 보러가기
Utility Types