지난 연습과 유사한 열거형 맵핑이 있는데, frontendToBackendEnumMap 을 생성하는 것입니다.

const frontendToBackendEnumMap = {
  singleModule: "SINGLE_MODULE",
  multiModule: "MULTI_MODULE",
  sharedModule: "SHARED_MODULE",
} as const

Challenge

여러분이 해야 할 일은 지금까지 배운 것을 사용해 frontendToBackendEnumMap 에서 모든 값을 가져오는 것입니다.

막히면 이전 연습을 다시 살펴보세요.

나의 답

import { Equal, Expect } from '../helpers/type-utils';

const frontendToBackendEnumMap = {
  singleModule: 'SINGLE_MODULE',
  multiModule: 'MULTI_MODULE',
  sharedModule: 'SHARED_MODULE',
} as const;

type BackendModuleEnum =
  typeof frontendToBackendEnumMap[keyof typeof frontendToBackendEnumMap];

type tests = [
  Expect<
    Equal<BackendModuleEnum, 'SINGLE_MODULE' | 'MULTI_MODULE' | 'SHARED_MODULE'>
  >
];

Indexed Access 권한이 있는 두 개의 연산자를 사용하여 모든 객체 값 가져오기

이 솔루션은 처음 보면 읽기 어렵지만 상당히 우아합니다.

type BackendModuleEnum =
  typeof frontendToBackendEnumMap[keyof typeof frontendToBackendEnumMap]

위의 코드에서, 우리는 frontendToBackendEnumMap 의 타입을 가져오고 있습니다. 그런 다음 대괄호 안에는 frontendToBackendEnumMap 의 키가 필요하다고 말합니다. 이것은 우리가 frontendToBackendEnumMap 에 모든 키를 사용해 인덱싱한다는 것을 의미하며, 이로써 모든 값들의 유니온이 반환됩니다.

솔루션 정리

위의 코드는 중간 타입을 생성하여 약간 정리할 수 있습니다.

type Obj = typeof frontendToBackendEnumMap

type BackendModuleEnum = Obj[keyof Obj]

typeof frontendToBackendEnumMap 을 Obj 타입으로 옮기면 패턴이 나타나기 시작하는 것을 볼 수 있습니다. 오브젝트를 가져와서 그 키를 사용하여 오브젝트로 인덱싱하고 있습니다.