DEV Community

Sergey Egorov
Sergey Egorov

Posted on

How to extend enum in TypeScript

From time to time you need to extend an enum in TypeScript, however, we can't use extends construction like in case of interface.

enum MySuperEnum {
  ONE,
  TWO
}

enum MyMoreSuperEnum extends MySuperEnum // This is wrong
Enter fullscreen mode Exit fullscreen mode

Of course, we can create one more enum and then create union type:

enum MySuperEnumExtender {
  THREE
}

type MyUnionType = MySuperEnum | MySuperEnumExtender;
Enter fullscreen mode Exit fullscreen mode

What we can get and why this approach is not good? MyUnionType is a type, we can't use it like enum to call its props.

So what we can do then?

First of all, we should use another and more preferable way of enum implementation with const. Why?

// describe an enum object
const  MySuperEnum = {
  ONE: 'ONE',
  TWO: 'TWO'
} as const

// create the MySuperEnum type
type MySuperEnum = typeof MySuperEnum[keyof typeof MySuperEnum];
Enter fullscreen mode Exit fullscreen mode

What is as const? Please click to find out more.

Cool! Now our MySuperEnum is defined in a different way!

It is time to create new MyMoreSuperEnum that will be extended with MySuperEnum.

// describe an enum object
const  MyMoreSuperEnum = {
  ...MySuperEnum,
  THREE: 'THREE'
} as const

// create the MyMoreSuperEnum type
type MyMoreSuperEnum = typeof MyMoreSuperEnum[keyof typeof MyMoreSuperEnum];
Enter fullscreen mode Exit fullscreen mode

Profit. Hope this trick will be useful for you.

Top comments (1)

Collapse
 
pilniczek profile image
Tomas • • Edited

This post nicely complements this video on enums, thank you!
https://www.youtube.com/watch?v=jjMbPt_H3RQ&list=PLF-hLGbunAPQMja6dpqUMoWfbfVc0zTi5