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

River Moon·2023년 7월 28일
0
post-thumbnail

유틸리티 타입이란?

타입스크립트에서 타입을 쉽게 변환할 수 있게 해준다.

ex) Partial, Pick, Omit, Required, ReturnType

1. Partial

Partial<T>T 타입의 모든 속성을 선택적(optional)으로 만드는 유틸리티 타입이다.

모든 속성이 옵셔널로 변경된 타입을 반환한다.

Partial<T>는 TypeScript에서 제공하는 유틸리티 타입 중 하나로, 제네릭 타입 T의 모든 속성을 선택적으로 만들어주는 타입이다. 즉, T 타입의 모든 속성이 필수가 아니라 선택사항으로 처리된다.

예를 들어, 다음과 같이 인터페이스 Person이 있다.

Partial<T>는 TypeScript에서 제공하는 유틸리티 타입 중 하나로, 제네릭 타입 T의 모든 속성을 선택적으로 만들어주는 타입이다. 즉, T 타입의 모든 속성이 필수가 아니라 선택사항으로 처리된다.

예를 들어, 다음과 같이 인터페이스 Person이 있다.

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

Person 인터페이스를 사용하여 객체를 만들려면 name, age, email 속성이 모두 필요하다.

const person: Person = {
  name: "John",
  age: 30,
  email: "john@example.com",
};

이제 Partial<T>를 사용하여 Person 인터페이스의 모든 속성을 선택적으로 만들어보겠다.

type PartialPerson = Partial<Person>;

const partialPerson: PartialPerson = {
  name: "John",
  age: 30,
};

Partial<Person>을 사용하면 name, age, email 속성이 모두 필수가 아닌 선택적인 속성으로 간주된다. 따라서 partialPerson 객체는 nameage만 가지고 있으며, email은 필수가 아니므로 생략할 수 있다.

Partial<T>를 사용하면 기존 타입을 확장하여 선택적인 속성을 추가하거나, 일부 속성을 선택적으로 만드는 데 유용하다. 이렇게 만들어진 선택적인 속성들은 해당 속성들을 필요로 하는 함수나 객체의 매개변수로 활용될 때 유연성을 제공한다.

2. Readonly

Readonly<T>T 타입의 모든 속성을 읽기 전용(read-only)으로 만드는 유틸리티 타입이다.

interface Car {
  make: string;
  model: string;
  year: number;
}

const myCar: Readonly<Car> = {
  make: 'Toyota',
  model: 'Camry',
  year: 2023
};

myCar.make = 'Honda';  // 이렇게 작성하면 에러가 난다. make 속성은 읽기 전용이다.

여기서 Readonly<Car>는 Car 타입의 모든 속성을 읽기 전용으로 만드는 것이다. 그러므로 myCar 객체의 속성 값은 생성 시에 지정한 후에는 변경할 수 없다. 이를 통해 의도치 않은 수정을 방지하고 코드의 안정성을 높일 수 있다.

3. Record<K,T>

Record<K,T>는 속성의 타입이 K, 값의 타입이 T인 객체를 생성하는 유틸리티 타입이다.

type FruitCount = Record<string, number>;

const fruitBasket: FruitCount = {
  apple: 5,
  banana: 4,
  grape: 10,
  orange: 3
};

fruitBasket.apple; // 5
fruitBasket.grape; // 10

여기서 Record<string, number>는 속성의 타입이 string, 값의 타입이 number인 객체를 의미합니다. fruitBasket은 이 타입에 따라 정의되므로, 모든 속성 이름은 문자열이고, 그에 해당하는 값은 숫자여야 합니다. 이렇게 Record 유틸리티 타입은 동적으로 속성을 생성하고 각 속성에 특정 타입을 할당하는 데 유용합니다.

4. Pick<T,K>

Pick<T,K>T에서 K 속성만 추출하여 새로운 타입을 생성하는 유틸리티 타입이다.

interface Profile {
  name: string;
  age: number;
  country: string;
}

let john: Pick<Profile, 'name' | 'age'> = {
  name: "John",
  age: 25
};

5. Omit<T,K>

리터럴타입으로 부분적인 프로퍼티들을 선택해 타입을 반횐한다.

Omit<T,K>T에서 K 속성을 제외한 새로운 타입을 생성하는 유틸리티 타입이다.

interface Profile {
  name: string;
  age: number;
  country: string;
}

let john: Omit<Profile, 'country'> = {
  name: "John",
  age: 25
};

6. Exclude<T,U>

Exclude<T,U>T에서 U에 해당하는 요소를 제거한 타입을 생성하는 유틸리티 타입이다.

type T = "a" | "b" | "c";
type U = Exclude<T, "a" | "b">; // "c"

7. Extract<T,U>

Extract<T,U>T에서 U에 해당하는 요소만 추출하여 새로운 타입을 생성하는 유틸리티 타입이다.

type T = "a" | "b" | "c";
type U = Extract<T, "a" | "b">; // "a" | "b"

8. NonNullable

NonNullable<T>T에서 nullundefined를 제외한 타입을 생성하는 유틸리티 타입이다.

type T = string | number | null | undefined;
type U = NonNullable<T>; // string | number

9. Parameters

Parameters<T>는 함수 T의 매개변수 타입들을 튜플 타입으로 생성하는 유틸리티 타입이다.

type T = Parameters<(a: string, b: number) => void>; // [string, number]

10. ReturnType

ReturnType<T>는 함수 T의 반환 타입을 생성하는 유틸리티 타입이다.

type T = ReturnType<() => string>; // string

11. Required

Required<T>T의 모든 속성을 필수적(required)으로 만드는 유틸리티 타입이다.

interface Profile {
  name: string;
		  age?: number; //옵셔널로 만들었지만 (필수로 넣을 필요가 없음)
}

let john: Required<Profile> = { 
//Required 타입으로 변환했기 때문에  age속성은 필수로 넣어야 된다.
  name: "John" // 에러! age 속성이 필요하다.
};

이 유틸리티 타입들은 TypeScript의 매우 유용한 기능 중 하나로, 코드를 효율적으로 작성하고 에러를 사전에 방지하는 데 도움을 준다. 이들을 잘 이해하고 사용하는 것이 TypeScript를 능숙하게 다루는 데 중요하다. 그 외에도 다른 유틸리티 타입이 있다.
타입스크립트 Utility Types 페이지 참고

profile
FE 리버

0개의 댓글