Partial / Omit / Pick (Typescript)

Jiwon Youn·2021년 1월 7일
1

PartialType

특정 타입의 부분 집합을 만족하는 타입을 정의 가능

interface Address {
  email: string;
  address: string;
}

type MyEmail = PartialType<Address>;
const me: MyEmail = {}; // 가능
const you: MyEmail = { email: "noh5524@gmail.com" }; // 가능
const all: MyEmail = { email: "noh5524@gmail.com", address: "secho" }; // 가능

OmitType

특정 속성만 제거한 타입을 정의 (Pick의 반대)

interface Product {
  id: number;
  name: string;
  price: number;
  brand: string;
  stock: number;
}

type shoppingItem = OmitType<Product, "stock">;

// 'stock' key를 제외 정의 가능
const apple: OmitType<Product, "stock"> = {
  id: 1,
  name: "red apple",
  price: 1000,
  brand: "del"
};

PickType

특정 타입에서 몇 개의 속성을 선택하여 정의

interface Product {
  id: number;
  name: string;
  price: number;
  brand: string;
  stock: number;
}

// 상품 목록을 받아오기 위한 api
function fetchProduct(): Promise<Product[]> {
  // id, name, price, brand, stock 모두를 써야함
}

type shoppingItem = Pick<Product, "id" | "name" | "price">;

function displayProductDetail(shoppingItem: shoppingItem) {
  // id, name, price의 일부만 사용 or 별도의 속성이 추가되는 경우가 있음
  // 인터페이스의 모양이 달라질 수 있음


// 일부 속성만 선택하여 update하기 위해서 아래와 같이 정의 가능
interface UpdateProduct {
  id?: number;
  name?: string;
  price?: number;
  brand?: string;
  stock?: number;
}

// 그러나 같은 인터페이스를 또 정의하는 일을 피하기 위해서 Partial 사용
function updateProductItem(prodictItem: Partial<Product>) {
  // Partial<Product>이 타입은 UpdateProduct 타입과 동일
}

기본 정의된 Entity에서
CreateDto = OmitType 사용 권장 (PrimaryGeneratedColumn 속성을 제외)
UpdateDto = PartialType 사용 권장 (일부 속성만 변경 가능하도록)

참고 출처 : https://kyounghwan01.github.io/blog/TS/Fundamentals/utility-types

0개의 댓글