TypeScript의 다른 객체 유형에서 공용체 유형을 만드는 방법은 무엇입니까?

Originally posted here!

다른 개체의 유형에서 union type를 만들려면 Typescript에서 개체의 유형 이름 다음에 keyof 연산자를 사용할 수 있습니다.

TL;DR

// Person type alias
type Person = {
  name: string;
  age: string;
  salary: string;
  userType: string;
};

// make union type from
// `Person` type alias
// using the `keyof` operator
type PersonKeys = keyof Person; // "name" | "age" | "salary" | "userType"

// make a variable and use the `PersonKeys` as its type
let john: PersonKeys = "age"; // ✅ Valid.
john = "hello"; // ❌ Invalid.

예를 들어, Person , name , age , salary 라는 4개의 속성이 있는 userType라는 유형 별칭이 있다고 가정해 보겠습니다.

// Person type alias
type Person = {
  name: string;
  age: string;
  salary: string;
  userType: string;
};

이제 객체의 유형string을 사용하여 union type를 만들기 위해 먼저 Person라는 type alias를 만든 다음 PersonKeys 연산자와 유형 별칭 이름을 사용합니다. 이 경우에는 keyof ) .

이런식으로 할 수 있는데,

// Person type alias
type Person = {
  name: string;
  age: string;
  salary: string;
  userType: string;
};

// make union type from
// `Person` type alias
// using the `keyof` operator
type PersonKeys = keyof Person; // "name" | "age" | "salary" | "userType"

이제 Person 공용체 유형이 작동하는지 증명하기 위해 PersonKeys를 PersonKeys라는 변수에 대한 유형으로 다음과 같이 사용합니다.

// Person type alias
type Person = {
  name: string;
  age: string;
  salary: string;
  userType: string;
};

// make union type from
// `Person` type alias
// using the `keyof` operator
type PersonKeys = keyof Person; // "name" | "age" | "salary" | "userType"

// make a variable and use the `PersonKeys` as its type
let john: PersonKeys = "age"; // ✅ Valid.
john = "hello"; // ❌ Invalid.

위의 코드에서 알 수 있듯이 john 값을 할당하는 것은 age 공용체 유형 중 하나이기 때문에 유효하고 PersonKeys 값을 할당하는 것은 다음을 만족하지 않으므로 유효하지 않습니다. hello 유니온 유형.

예, 다른 개체의 유형에서 통합 유형을 성공적으로 만들었습니다. 🥳

codesandbox 에 있는 위의 코드를 참조하세요.

그게 다야 😃!

😃 유용하셨다면 공유해 주세요.