객체의 값을 리터럴 타입으로 해석하기
여기에는 한 종류의 enum에서 다른 종류의 enum으로 매핑하는 programModeEnumMap
이라는 non-타입스크립트 객체가 있습니다.
export const programModeEnumMap = {
GROUP: "group",
ANNOUNCEMENT: "announcement",
ONE_ON_ONE: "1onl",
SELF_DIRECTED: "selfDirected",
PLANNED_ONE_ON_ONE: "plannedlonl",
PLANNED_SELF_DIRECTED: "plannedSelfDirected",
}
대문자 키는 백엔드에서 오는 것이고 소문자 문자열은 프론트엔드에서 사용하려는 것이라고 상상해 보세요.
연습 코드의 programModeEnumMap
아래에 GroupProgram
으로 시작하는 여러 타입이 있습니다.
export type GroupProgram = typeof programModeEnumMap["GROUP"]
이 줄을 보면 GroupProgram
의 타입이 "group"
인 것처럼 보이지만 마우스를 가져가면 실제로는 string
이라는 것을 알 수 있습니다.
문제는 이러한 값을 리터럴 값과 함께 상수로 해석하도록하는 어노테이션을 programModeEnumMap
객체에 추가하는 것입니다.
도움이 필요하면 타입스크립트 문서의 Everday Types 섹션을 참조하세요.
import { Equal, Expect } from '../helpers/type-utils';
/**
* Some docs that might help!
* <https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-4.html#const-assertions>
*/
export const programModeEnumMap = {
GROUP: 'group',
ANNOUNCEMENT: 'announcement',
ONE_ON_ONE: '1on1',
SELF_DIRECTED: 'selfDirected',
PLANNED_ONE_ON_ONE: 'planned1on1',
PLANNED_SELF_DIRECTED: 'plannedSelfDirected',
} as const;
export type GroupProgram = typeof programModeEnumMap['GROUP'];
export type AnnouncementProgram = typeof programModeEnumMap['ANNOUNCEMENT'];
export type OneOnOneProgram = typeof programModeEnumMap['ONE_ON_ONE'];
export type SelfDirectedProgram = typeof programModeEnumMap['SELF_DIRECTED'];
export type PlannedOneOnOneProgram =
typeof programModeEnumMap['PLANNED_ONE_ON_ONE'];
export type PlannedSelfDirectedProgram =
typeof programModeEnumMap['PLANNED_SELF_DIRECTED'];
type tests = [
Expect<Equal<GroupProgram, 'group'>>,
Expect<Equal<AnnouncementProgram, 'announcement'>>,
Expect<Equal<OneOnOneProgram, '1on1'>>,
Expect<Equal<SelfDirectedProgram, 'selfDirected'>>,
Expect<Equal<PlannedOneOnOneProgram, 'planned1on1'>>,
Expect<Equal<PlannedSelfDirectedProgram, 'plannedSelfDirected'>>
];
as const
추가
해결책은 아래와 같이 programModeEnumMap
객체에 as const
어노테이션을 추가하는 것입니다.