Typescript에 있는 객체의 키와 값의 유형

Typescript에 있는 객체의 키와 값의 유형

하나의 문자열에서 다른 문자열로 상수 개체로 매핑하는 문자열 값 세트가 두 개 있습니다.이 매핑에서 두 가지 유형을 생성합니다. 하나는 키용이고 다른 하나는 값입니다.

const KeyToVal = {
    MyKey1: 'myValue1',
    MyKey2: 'myValue2',
};

키는 충분히 간단합니다.

type Keys = keyof typeof KeyToVal;

값에 대한 컴파일 시간 유형을 얻는 데 문제가 있습니다.다음 중 하나가 효과가 있을 것 같아서요

type Values = typeof KeyToVal[Keys];
type Values<K> = K extends Keys ? (typeof KeyToVal)[K] : never;
type Prefix<
    K extends Keys = Keys, 
    U extends { [name: string]: K } = { [name: string]: K }
> = {[V in keyof U]: V}[K];

이 모든 것이 방금 만든 것이다.Values되려고string또, 타이프 스크립트의 lookups를 사용해 type mapValues를 추론하는 방법」의 2개의 답을 수정해 보았습니다만, 적응이 잘못되었거나, 처음부터 시나리오에 맞지 않았던 것입니다.

컴파일러는 문자열 리터럴 유형을 다음과 같이 확장합니다.string단, github 문제 및 PR에서 설명한 바와 같이 특정 조건이 충족되거나 const assertion이 리터럴 값으로 사용되는 경우는 제외합니다.TypeScript 3.4에 Const 어사션이 표시되었습니다.

const KeyToVal = {
    MyKey1: 'myValue1',
    MyKey2: 'myValue2',
} as const;

type Keys = keyof typeof KeyToVal;
type Values = typeof KeyToVal[Keys]; //  "myValue1" | "myValue2"

3.4 이전 버전에서는 동일한 효과를 얻기 위한 회피책이 있었습니다.컴파일러가 리터럴 타입을 추론하도록 하려면 오브젝트를 적절히 세공된 범용 타입 파라미터를 사용하여 함수를 통과시켜야 합니다.이 경우 다음과 같은 트릭을 할 수 있습니다.

function t<V extends string, T extends {[key in string]: V}>(o: T): T {return o}

이 함수의 전체 목적은 유형을 캡처하고 보존하여 유형 추론을 활성화하는 것입니다. 그렇지 않으면 전혀 쓸모가 없습니다. 그러나 이 함수로 당신은 그것을 가질 수 있습니다.

const KeyToVal = t({
    MyKey1: 'myValue1',
    MyKey2: 'myValue2',
});

type Keys = keyof typeof KeyToVal;
type Values = typeof KeyToVal[Keys]; //  "myValue1" | "myValue2"

사실, 당신은 그것을 바꾸어야 합니다.KeyToVal다음 선언으로 이동합니다.

const KeyToVal = {
    MyKey1: 'myValue1',
    MyKey2: 'myValue2',
} as const; // <----- add the <as const> here

그런 다음 키 유형을 만듭니다.

type Keys = keyof typeof KeyToVal;

이제 값 유형을 만들 수 있습니다.

type ValuesTypes = typeof KeyToVal[Keys];

개체에서 유형을 추론하려고 합니다(임의의 수의 키/값을 가질 수 있음).먼저 유형을 기술하고(또는 인터페이스를 사용하는 것이 좋을 수도 있습니다), 다음으로 다음과 같이 Kyes와 Values를 추론할 수 있습니다.

type KeyToObjMap = {
  some: "other",
  more: "somemore",
};

type Keys = keyof KeyToObjMap;

type Values = KeyToObjMap[Keys];

let one: Values = "some";
let two: Values = "other";
let three: Keys = "some";
let four: Values = "somemore";
let five: Keys = "fun";

IDE에서 올바른 하이라이트가 표시됩니다.

동일하지는 않지만 단일 개체 대신 개체 배열이 있는 경우 다음과 같은 작업을 수행하여 알려진 속성 값을 추출하여 유형을 생성할 수 있습니다.

const keyToValArray = [
  { value: 'myValue1', label: 'myLabel1' },
  { value: 'myValue2', label: 'myLabel2' }
] as const;
type Keys = typeof keyToValArray[number]['value']; // 'myValue1' | 'myValue2'

관련이 없을 수도 있다는 것을 알고 있습니다만, 제 유스케이스에서는 오브젝트 또는 어레이를 기반으로 유형을 만들고 싶었기 때문에 이 질문을 하게 되었습니다.그래서 저는 같은 사용 사례를 가진 사람이 에넘을 사용하는 것이 유용할 것이라고 생각했습니다.다음과 같이 열거형을 정의할 수 있습니다.

enum Arrow {
  Up,
  Down,
  Left,
  Right
}

자세한 내용은 이쪽과 이쪽에서 보실 수 있습니다.

이제 이 열거형을 유형으로 사용할 수 있습니다.

type Props = {
  arrow: Arrow
}

const Component = (props: Props) => {
  switch(props.arrow) {
    case Arrow.Up:
      // go-up
    case Arrow.Down:
      // go-down
    ...
  }

}

컴포넌트에서 사용할 수 있습니다.

  <Component arrow={Arrow.top} />

언급URL : https://stackoverflow.com/questions/53662208/types-from-both-keys-and-values-of-object-in-typescript