TypeScript에서 유틸리티 유형의 강력한 활용

안녕하세요, TypeScript 전사 여러분! ? TypeScript에 깊이 빠져 계시다면 "유형 관리만을 위한 코드가 왜 그렇게 많은가요?" 걱정하지 마세요. 혼자가 아닙니다. 우리 모두는 이 거친 정적 유형의 라이딩을 함께 하고 있습니다.

오늘은 TypeScript의 가장 멋진 도구 중 일부인 유틸리티 유형에 대해 알아보겠습니다. 이는 코드 속도를 높이고 단순화하는 데 도움이 되는 비디오 게임의 작은 치트 코드와 같습니다. 이제 소매를 걷어붙이고 TypeScript에서 가장 유용한 유틸리티 유형과 이러한 유틸리티 유형이 코드를 덜 골치 아프게 만드는 방법을 재미있게 살펴보겠습니다.

뭐야? 더 많은 유형.

처음부터 모든 것을 작성하지 않고 TypeScript 유형으로 작업하려고 한다고 상상해 보세요(누가 그럴 시간이 있겠습니까?). 유틸리티 유형을 사용하면 다른 유형의 일부를 변환하거나 재사용하여 새로운 유형을 만들 수 있습니다. 추가 노력 없이 자르고 깍둑썰기할 수 있는 멋진 주방 도구라고 생각하세요. 시간을 절약하고 중복성을 줄이며 코드를 훨씬 쉽게 관리할 수 있습니다. 하나씩 분해해 볼까요!

부분

기능: 유형의 모든 속성을 선택 사항으로 만듭니다. 네, 참 쉽죠.

사랑할 수밖에 없는 이유: 일부 물건이 필요하지만 전부는 아닌 경우에 적합합니다.

type User = {
  id: number;
  name: string;
  email: string;
};

function updateUser(id: number, newValues: Partial<User>) {
  // Update only the properties you need, no need to bring everything.
}

updateUser(1, { name: "Ash" }); // Only updating name, thanks to Partial!

필수

기능: 유형의 모든 속성을 필수로 만듭니다. TypeScript의 "어떤 필드도 건너뛰지 마세요!"라는 짧은 표현입니다.

사랑할 수밖에 없는 이유: 때로는 옵션이 옵션이 아닌 경우도 있습니다. 특히 이전에 특정 속성이 선택 사항이었던 경우에는 모든 것을 잠그고 로드해야 합니다.

type UserWithOptionalFields = {
  id: number;
  name?: string;
  email?: string;
};

const user: Required<UserWithOptionalFields> = {
  id: 1,
  name: "John",
  email: "john@example.com",
}; // All properties are now required!

레코드<키, 유형>

기능: Keys 키와 Type 값을 사용하여 객체 유형을 생성합니다. TypeScript의 "나만의 사전 만들기" 기능이라고 생각하세요.

내가 사랑받는 이유t: 이 유형은 특히 키를 미리 알고 있는 경우 데이터를 빠르고 쉽게 매핑하고 싶을 때 가장 좋은 친구입니다.

type Role = "admin" | "user" | "guest";

const rolePermissions: Record<Role, string[]> = {
  admin: ["read", "write", "delete"],
  user: ["read", "write"],
  guest: ["read"],
};

선택<유형, 키>

기능s: 기존 유형을 가져와서 지정한 속성만 선택합니다. TypeScript에서 "이것을 짧고 간단하게 유지하자"라고 말하는 방식이라고 생각하세요.

사랑할 수밖에 없는 이유: 모든 것을 끌지 않고도 기존 유형의 하위 집합을 만드는 데 적합하며 제가 가장 좋아하는 기능 중 하나입니다.

type User = {
  id: number;
  name: string;
  email: string;
  age: number;
};

type UserPreview = Pick<User, "id" | "name">;

<유형, 키> 생략

무엇을 하는가: Pick과 반대입니다. 유형에서 특정 속성을 제외할 수 있습니다.

사랑할 수밖에 없는 이유: 유형이 있으면 좋지만 원하지 않는 성가신 분야가 딱 하나 있습니다.

type User = {
  id: number;
  name: string;
  email: string;
};

function updateUser(id: number, newValues: Partial<User>) {
  // Update only the properties you need, no need to bring everything.
}

updateUser(1, { name: "Ash" }); // Only updating name, thanks to Partial!

Exclude

기능: 공용체에서 특정 유형을 제거합니다. TypeScript의 "그룹 채팅에서 벗어나기"입니다.

이 앱을 좋아하는 이유: 대규모 노조가 있지만 일부 사례만 처리해야 할 때 매우 유용합니다.

type UserWithOptionalFields = {
  id: number;
  name?: string;
  email?: string;
};

const user: Required<UserWithOptionalFields> = {
  id: 1,
  name: "John",
  email: "john@example.com",
}; // All properties are now required!

Extract

무엇을 하는가: Exclude, Extract의 쌍둥이 형제는 주어진 공용체와 일치하는 유형만 유지합니다.

사랑할 수밖에 없는 이유: 이 유형은 관련 부분만 모아서 조합 유형을 좁힙니다.

type Role = "admin" | "user" | "guest";

const rolePermissions: Record<Role, string[]> = {
  admin: ["read", "write", "delete"],
  user: ["read", "write"],
  guest: ["read"],
};

그리고 거기에 있습니다! ? Extract와 Pick은 비슷하게 들리지만 서로 다른 작업에 고유하게 적합합니다. Extract는 공용체 유형에 대한 필터인 반면 Picklets는 객체 유형에서 속성을 선별합니다. 제외(Exclude)와 생략(Omit)도 마찬가지입니다.

이 유틸리티 유형은 작지만 강력합니다! 시간을 절약하고 코드 중복을 줄이며 깔끔하게 유지합니다. 따라서 다음에 유형과 씨름할 때 이러한 도우미를 기억하십시오. TypeScript 여정을 단순화하고 좀 더 재미있게 만들어 줄 것입니다. 즐거운 코딩 되세요. 귀하의 유형이 항상 귀하에게 꼭 필요한 것이 되기를 바랍니다! ?

위 내용은 TypeScript에서 유틸리티 유형의 강력한 활용의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!