Extending Enum in typescript

TypescriptTypescript Typings

Typescript Problem Overview


I was hoping to reuse certain values in enum. Any suggestions of how to achieve such functionality.

enum someEnum {
    a = 'Some String',
    b = 2,
};

enum extendedEnum {
    c = 'string',
    b = someEnum.b
}

type someEnumType<T extends someEnum> = T extends someEnum.a ? string :
    T extends someEnum.b ? number : never;

type extendedEnumType<T extends extendedEnum> =
    T extends extendedEnum.c ? string:          // Gives Error
    T extends extendedEnum.b ? number : never;  // Gives Error

Typescript Solutions


Solution 1 - Typescript

Currently, You can't extend enum in TypeScript

Another option is to use type:

enum Color1 {
  Red = "Red",
  Green = "Green"
}

enum Color2 {
  Yellow = "Yellow",
  Blue = "Blue"
}

define a new type named Colors :

type Colors = Color1 | Color2;

Then you can use it as below :

public color: Colors;

ngOnInit(): void {
  const Colors = { ...Color2, ...Color1 };
  this.color = Colors.Red; // Colors.Green or Colors.Yellow or Colors.Blue
}

Stackblitz Here

Solution 2 - Typescript

You could use a union in your type:

enum abc {
  a = 1,
  b = 2,
  c = 3
}

enum def {
  d = 4,
  e = 5,
  f = 6
}

type abcdef = abc | def;

let x: abcdef;

x = abc.a;
x = def.d;

Solution 3 - Typescript

I've just stumbled across this post from 2018 that explains how to do it with string based enums. See [1] for the original comment.

Here's an annotated / fruity version:

enum someEnum {
  Apple = 'Apple',
  Banana = 'Banana'
}

enum extendedEnum {
  Pear = 'Pear',
  Grape = 'Grape'
}

// The key seems to be to declare a type AND
// a const with the same name

type AllFruits = someEnum | extendedEnum;
const AllFruits = {...someEnum, ...extendedEnum};

let f: AllFruits = AllFruits.Grape;

The original poster (who, by all rights, seems to have been a contributor to TypeScript and knows what they're talking about) mentions that, using this method, you can't use something like AllFruits.Grape as a 'type literal', which means you can't do this:

// This error will appear: 
// 'AllFruits' only refers to a type, but is being used as a namespace here.

interface FruitBowl {
    fruit: AllFruits.Grape    
}

but this can be fixed with (something quite ugly) like:

interface FruitBowl {
    fruit: typeof AllFruits.Grape    
}

I guess this is one of the 'type workarounds' that others have mentioned.

(All credit to https://github.com/alangpierce) [1]: https://github.com/microsoft/TypeScript/issues/17592#issuecomment-449440944

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionAmol GuptaView Question on Stackoverflow
Solution 1 - TypescriptAbolfazlRView Answer on Stackoverflow
Solution 2 - TypescriptWilliam MooreView Answer on Stackoverflow
Solution 3 - TypescriptJ BrewerView Answer on Stackoverflow