DEV Community

Volodymyr Yepishev
Volodymyr Yepishev

Posted on

4 1

Typed Enum Flipping in Typescript

Ever had a situation where you needed to swap key-value pairs of an enum in typescript and attempts to type it resulted in ugly Record<string, string> sort of crutch?

Turns out key remapping that came with v4.1 make it a breeze :)

Suppose we have some rhymes

enum Rhymes {
  Money = 'bread and honey',
  Phone = 'dog and bone'
}
Enter fullscreen mode Exit fullscreen mode

Key remapping and template literals allow us to write a generic to swap they keys for values:

type FlippedRecord<T> = {
  [K in keyof T as `${string & T[K]}`]: K
};
Enter fullscreen mode Exit fullscreen mode

So now we can get some type safety while creating flipped enum maps:

const reversedEnum: FlippedRecord<typeof Rhymes> = {
  'bread and honey': 'Money',
  'dog and bone': 'Phone'
}
Enter fullscreen mode Exit fullscreen mode

It's boombastic, check it out in playground :)

Top comments (0)

11 Tips That Make You a Better Typescript Programmer

typescript

1 Think in {Set}

Type is an everyday concept to programmers, but it’s surprisingly difficult to define it succinctly. I find it helpful to use Set as a conceptual model instead.

#2 Understand declared type and narrowed type

One extremely powerful typescript feature is automatic type narrowing based on control flow. This means a variable has two types associated with it at any specific point of code location: a declaration type and a narrowed type.

#3 Use discriminated union instead of optional fields

...

Read the whole post now!