일반적인 Typescript 유형 유틸리티

Typescript에는 유형을 조작하기 위한 많은 내장 유형 유틸리티가 포함되어 있습니다. 이 게시물에서는 가장 중요한 유형을 살펴보겠습니다.

1. 필수

Required 유형 유틸리티는 0개 이상의 선택적 속성이 있는 레코드를 가져와 필수로 만듭니다.

예시:

type User = {
    name: string;
    age: number;
    admin?: boolean;
};

type RequiredUser = Required<User>

admin의 RequiredUser 속성은 더 이상 선택 사항이 아닙니다.

#shorts 일부 유형 T의 typescript 필수 유형 유틸리티는 모든 속성을 필수로 만듭니다(선택사항이 아님).



youtube.com

2. 부분적

Partial 유형 유틸리티는 Required 와 반대 방식으로 작동합니다. 0개 이상의 필수 속성이 있는 레코드가 제공되면 해당 속성을 선택 사항으로 바꿉니다.

예시:

type User = {
    name: string;
    age: number;
    admin: boolean;
};

const updateUser = (user: User, newProps: Partial<User>) => {
    return { ...user, ...newProps };
};

위의 예에서 updateUser 함수는 User와 같이 newProps의 0개 이상의 속성이 필요합니다. Partial<User>가 아닌 경우 소비자가 User의 모든 속성을 제공해야 합니다. 그러한 사용 사례의 경우.

#shorts 일부 유형 T의 Partial은 모든 속성을 선택적으로 만들고 필수 유형 유틸리티와 반대 방식으로 작동합니다.



youtube.com

3. 픽

Pick<T, keys>는 레코드T와 해당 레코드에서 keys 세트를 가져와 보관합니다.

예시:

type User = {
    name: string;
    age: number;
    admin?: boolean;
};

type NameAndAge = Pick<User, "name" | "age">

NameAndAge는 name 및 age 속성만 있는 레코드입니다.

4. 생략

Omit<T, keys> 는 Pick<T, keys> 와 매우 유사하지만 반대로 작동하여 keys 에서 T 를 제거합니다.

위의 예에서 동일한 결과를 얻으려면 다음을 수행합니다.

type NameAndAge = Omit<User, "admin">

typescript의 Pick & Omit 유형 유틸리티는 유형과 키 세트를 각각 유지하거나 제거합니다. 그들은 동일한 결과를 달성하는 데 사용할 수 있습니다.



youtube.com

5. 추출물

Extract<T, U>는 T 및 U 유형에 대해 set intersection을 수행합니다. 즉, T 및 U 모두에 할당할 수 있는 유형의 하위 집합을 선택합니다.

예시:

type Candidates =
    "a" | "b" | "c" | "d" | "e";
type WinnerList = "a" | "d" | "z";

type Winners = Extract<Candidates, WinnerList>

여기서 Extract는 Candidates 중에서 "승자"를 식별합니다. 기본적으로 승리하려면 후보가 WinnerList에 할당될 수 있어야 합니다.

#shorts typescript의 추출 유형 유틸리티를 사용하면 유형에 교차 설정을 수행할 수 있습니다.



youtube.com

6. 제외

Exclude<T, U> 는 Extract 와 T 사이의 set difference 즉, U 에 할당할 수 없는 T 의 모든 항목을 유지한다는 점을 제외하면 U 와 유사합니다.

마지막 예를 계속하면 "패자"는 다음과 같습니다.

type Losers = Exclude<Candidates, Winners>

"패자"는 모두 "승자"가 아닙니다.

7. 읽기 전용

Readonly<T> 는 Object.freeze() 와 유사하게 속성이 우발적으로 변경되는 것을 방지하지만 유형 수준에서 작동합니다.

typescript의 읽기 전용 유형 유틸리티를 사용하면 특정 유형의 모든 속성을 읽기 전용으로 변환할 수 있습니다.#typescript #webdevelopment



youtube.com



Parameters<f> , ReturnType<f> 와 같이 각각 매개변수를 가져오고 함수 유형을 반환하고 Awaited<Promise<T>> 에서 T 를 래핑 해제하는 Promise<T> 와 같은 다른 유용한 내장 유형 유틸리티가 있습니다.

우리는 Typescript에서 유형 조작의 표면을 긁어모았을 뿐입니다. 정신을 차리고 싶다면 ts-toolbelt 및 type-challenges 과 같은 커뮤니티 프로젝트를 확인하세요.

이 게시물이 마음에 드셨다면 반응을 해주시고 더 많은 소식을 팔로우하는 것을 잊지 마세요.