How can I retrieve the name of a constant enum member in TypeScript as a string?

Question

How can I retrieve the name of a constant enum member in TypeScript as a string?

Consider the following const enum declaration:

const enum Snack {
    Apple = 0,
    Banana = 1,
    Orange = 2,
    Other = 3
}

Is it possible in TypeScript to retrieve the string representation of a specific member?

In C#, this could be achieved with nameof(Snack.Orange). (While nameof is not available in TypeScript, there are workarounds for non-const enums.)

typescript

Answer 1

Answer №1

Const enums are typically removed at compile time, meaning there is no runtime representation of the enum object. To preserve const enums and force the generation of the enum object, you can use preserveConstEnums. However, even with this flag, accessing the enum object directly is not allowed by the compiler, requiring a workaround.

One approach with preserveConstEnums enabled is to place the enum within a namespace:

namespace enums {
    export const enum Snack {
        Apple = 0,
        Banana = 1,
        Orange = 2,
        Other = 3
    }
}
let enumName = (enums as any).Snack[enums.Snack.Apple];

Alternatively, if the enum is part of a module:

export const enum Snack {
    Apple = 0,
    Banana = 1,
    Orange = 2,
    Other = 3
}

let enumName = (exports as any).Snack[Snack.Apple];

If you prefer not to use the flag, another workaround is to create an object that must include all enum members, allowing you to search for the name within it. This way, any additions or removals from the enum will prompt a compile-time error on the object:

let SnackNames: { [P in keyof typeof Snack]: { Name: P, Value: typeof Snack[P] } } = {
    Apple: { Value: Snack.Apple, Name: "Apple" },
    Banana: { Value: Snack.Banana, Name: "Banana" },
    Orange: { Value: Snack.Orange, Name: "Orange" },
    Other: { Value: Snack.Other, Name: "Other" },
}

Answer 2

Const enums are typically removed at compile time, meaning there is no runtime representation of the enum object. To preserve const enums and force the generation of the enum object, you can use preserveConstEnums. However, even with this flag, accessing the enum object directly is not allowed by the compiler, requiring a workaround.

One approach with preserveConstEnums enabled is to place the enum within a namespace:

namespace enums {
    export const enum Snack {
        Apple = 0,
        Banana = 1,
        Orange = 2,
        Other = 3
    }
}
let enumName = (enums as any).Snack[enums.Snack.Apple];

Alternatively, if the enum is part of a module:

export const enum Snack {
    Apple = 0,
    Banana = 1,
    Orange = 2,
    Other = 3
}

let enumName = (exports as any).Snack[Snack.Apple];

If you prefer not to use the flag, another workaround is to create an object that must include all enum members, allowing you to search for the name within it. This way, any additions or removals from the enum will prompt a compile-time error on the object:

let SnackNames: { [P in keyof typeof Snack]: { Name: P, Value: typeof Snack[P] } } = {
    Apple: { Value: Snack.Apple, Name: "Apple" },
    Banana: { Value: Snack.Banana, Name: "Banana" },
    Orange: { Value: Snack.Orange, Name: "Orange" },
    Other: { Value: Snack.Other, Name: "Other" },
}

How can I retrieve the name of a constant enum member in TypeScript as a string?

Answer №1

Similar questions

The functionality for jest mocking with the Google Secret Manager client is currently not working as

Utilize Typescript to aim for the most recent edition of EcmaScript

Encountering an error in Angular 4: 'Cannot find property on specified component type'

How do I add a new item to an object using Ionic 2?

Incorporating a class element within an Angular 2 directive

Unlocking 'this' Within a Promise

The debate between using backticks and colons in TypeORM queries

Ways to retrieve data beyond the constructor

How can you transform an object literal AST from a TypeScript file into executable code?

Using Typescript to Encapsulate the Assertion that Foo Belongs to a Specific Type

Encountering a TypeScript error in MUI 5 when attempting to spread values in props

Create a versatile generic object using TypeScript

Issue: Vue TypeScript module not foundDescription: When using

When a function is transferred from a parent component to a child component's Input() property, losing context is a common issue

How to format dates with month names in various languages using the date pipe

Leveraging Multiple @Input Decorators in Ionic 3 and Angular 2

Encountering ReferenceError when attempting to declare a variable in TypeScript from an external file because it is not defined

Error in hook order occurs when rendering various components

Rendering a child component in the DOM tree with Aurelia StageComponent

How can I retrieve List<T> from a Razor Page using TypeScript?