[TypeScript] 유틸리티 타입(제네릭 타입)

TypeScript는 공통 타입 변환을 용이하게 하기 위해 몇 가지 유틸리티 타입을 제공한다.

Partial

파셜타입은 특정 타입의 부분집합을 만족하는 타입을 정의한다

interface Login {
  email : string
  password : string
}

type MyLogin = Partial<Address>
const google : MyLogin = {}
const naver : MyLogin = {email : 'sally@naver.com'}
const kakao : MyLogin = {email : 'sally@kakao.com', password : 'string'}

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

// Partial - 상품의 정보를 업데이트 (put) 함수 -> id, name 등등 어떤 것이든 인자로 들어올수있다
// 인자에 type으로 Product를 넣으면 모든 정보를 다 넣어야 한다.

//😵
interface UpdateProduct {
  id?: number;
  name?: string;
  price?: number;
  brand?: string;
  stock?: number;
}

만약 patch 함수를 만들때, Product 타입을 넣으면 모든 정보를 더 넣어줘야한다.
그렇다고, UpdateProduct와 같이 interface를 또 정의하는 멍청한 타입을 만들지는 말자.(나자신😇)
Partial<Product> === UpdateProduct이다.

따라서

 function updateProductItem(prodictItem: Partial<Product>) {
}

UpdateProduct 대신에 Partial<Product>를 적용시켜줄 수 있다.

Pick

픽 타입은 특정 타입에서 몇 개의 속성을 선택하여 타입을 정의한다.

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


//😵
interface ProductDetail {
  id: stirng
  name : string 
  price : number
}

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

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

Product타입에서 일부 타입만 가져오고 싶을 때 Pick을 적용해 볼 수 있다.
예를들어 상품 상세정보에 id , name, price 값만 필요하다고 가정해보자.
Pick을 사용해 Product타입에서 "id","name","price"값을 가져와 타입을 만들어줄 수 있다.

Omit

특정 속성만 제거한 타입을 정의할 수 있다.(pick의 반대)

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

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

const apple: Omit<Product, "stock"> = {
  id: 1,
  name: "red apple",
  price: 1000,
  brand: "del"
};