Typescript 유틸리티 유형

소개

Typescript를 본격적으로 배우기 시작하면서 우리가 속한 회사의 코드베이스에서 유형을 리팩토링하려고 할 때 유용하다는 것을 알게 되었습니다a set of utility types.

그 전에는 유형 코드를 재사용하기 위해 세분화된 유형을 만들고 해당 필드에 필요한 각 유형으로 내보내야 한다고 가정했습니다.

예를 들어 Person 타입이나 Parent 타입에서 사용하고 있는 Child 타입이 있다면 직접 만들어서 내보내서 사용해야 합니다. 물론 이것은 단순한 예일 뿐입니다. 구성 요소 간에 많은 유형을 공유하게 되면 해당 유형을 사용하려고 할 때마다 유형을 가져오는 것이 얼마나 다루기 힘든지 알 수 있습니다.

유틸리티 유형을 입력합니다. 이러한 유틸리티는 각 기능을 중복 정의하고 가져오는 문제를 제거하는 것을 목표로 합니다. 그 중 유용하다고 생각되는 몇 가지를 살펴보고자 합니다.

유용

선택하다

유형 내에서 일부 속성을 재사용하거나 "선택"하려면 Pick 를 사용합니다. 기존 유형의 속성을 복사하기 위해 새 유형을 생성해야 하는 시간을 절약할 수 있어 매우 유용합니다.

interface Workstation {
    CPU: string
    GPU: string
    RAM: string
    monitor: string
    keyboard: monitor
}

type Computer = Pick<Workstation, 'CPU' | 'GPU' | 'RAM'> 

부분

특정 유형의 속성을 선택 사항으로 만들려면 Partial 를 사용합니다. 리팩토링할 때 유용합니다.

interface Car {
    wheels: string
    windshield: string
    body: string
    doors: string
}

type Car2 = Partial<Car>

필수의

반면에 특정 유형의 속성을 필수로 만들려면 Required 를 사용합니다. 외부 라이브러리 유형을 기반으로 유형을 강제 적용하는 데 유용합니다.

interface OptionalParams {
    a?: string
    b?: string
}

type RequiredParams = Required<OptionalParams>

기록

구성을 위한 유형을 구성할 때 매우 유용합니다.

interface Person {
    name: string
}

type Family = ‘father’ | ‘mother’ | ‘sibling’

const myFamily: <Family, Person> = {
    father: { name: ‘John’ },
    mother: { name: ‘Jane’ },
    sibling: { name: ‘Joe’ }
}

생략

유형의 축소 버전을 얻는 데 매우 유용합니다.

interface Article {
    title: string;
    summary: string;
      text: string;

}

type ArticlePreview = Omit<Article, text>;

const todo: ArticlePreview = {
    title: ‘The misadventures of Joe’,
    summary: ‘Joe goes out of his way to explore. Will he survive?’
};

들어오지 못하게 하다

기본적으로 두 세트의 "보완"

type Toys = Exclude<“knife” | “ball” | “xylophone”, “knife”>;  // “ball” | “xylophone”

발췌

기본적으로 두 세트의 "교차점"

type Vehicle = Extract<“skateboard” | “car” | “motorbike”, “car” | “motorbike” | “wheelchair”>;  // “car” | “motorbike”

결론

Typescript 학습을 지속적으로 개선하고 이를 내 코드에 통합하려고 시도하면서 이러한 유틸리티 유형을 더 많이 사용하는 것을 발견했습니다. 너무 과하지 않은 한 내 코드를 더 간결하고 이해하기 쉽게 만드는 데 도움이 됩니다. 여러분들도 유용하게 사용하시길 바랍니다.