Ways to determine if the type is an enum in TypeScript

Question

Ways to determine if the type is an enum in TypeScript

Consider the following string enum type:

export enum UserRole {
admin = "admin",
active = "active",
blocked = "blocked"
}

I'm looking to determine whether a specific string emulates this enum type. How can I achieve this?

  const decodedJson = JSON.parse(decodedString)
  if(decodedJson && (decodedJson.role instanceof UserRole) // My attempt at checking if the role is an enum string. However, this method is incorrect.

What would be the proper approach in this case?

typescript oop enums

Answer 1

Answer №1

I typically avoid using enums in TypeScript because they are one of the features that do not align with TypeScript's language design goals. They exist outside of JavaScript but compile to JavaScript, making it challenging to refer to a JavaScript spec for runtime behavior.

However, if you're interested in understanding the runtime behavior of enums rather than their role in the type system, then we can explore that aspect further. At runtime, an enum simply functions as an object with keys and values. Specifically, when utilizing a string enum, the keys and values will match the defined key-value pairs.

(In the case of a numeric enum, there are also reverse mappings where the value acts as a key and vice versa. While this might be confusing, it doesn't directly relate to your inquiry so I'll refrain from delving into it unless requested.)

The similarity between the keys and values in your enum introduces ambiguity that should be avoided. To address this, let's redefine UserRole as follows:

enum UserRole {
    ADMIN = "admin",
    ACTIVE = "active",
    BLOCKED = "blocked",
}

This enables us to distinguish between whether a given string is a key or value within the enum. For instance, to determine if a provided string role is a key in the enum, we can employ the following approach:

const roleIsEnumKey = role in UserRole;
console.log("role " + role + (roleIsEnumKey ? " IS " : " IS NOT ") + "a key in UserRole");

Similarly, to ascertain if the string corresponds to a value in the enum, you can use:

const roleIsEnumValue = (Object.values(UserRole) as string[]).includes(role);
console.log("role " + role + (roleIsEnumValue ? " IS " : " IS NOT ") + "a value in UserRole");

Assuming your JavaScript version supports Object.values() and Array.prototype.includes(), you can verify the keys and values. Otherwise, feel free to iterate over Object.keys() or any preferred method.

To test the functionality:

check(JSON.stringify({ role: "ADMIN" }));
// role ADMIN IS a key in UserRole 
// role ADMIN IS NOT a value in UserRole

check(JSON.stringify({ role: "admin" }));
// role admin IS NOT a key in UserRole 
// role admin IS a value in UserRole 

check(JSON.stringify({ role: "random" }));
// role random IS NOT a key in UserRole
// role random IS NOT a value in UserRole

Seems effective. Ultimately, at runtime, the enum behaves like an object, allowing inspection of its keys and values similar to any other object.

Playground link

Answer 2

I typically avoid using enums in TypeScript because they are one of the features that do not align with TypeScript's language design goals. They exist outside of JavaScript but compile to JavaScript, making it challenging to refer to a JavaScript spec for runtime behavior.

However, if you're interested in understanding the runtime behavior of enums rather than their role in the type system, then we can explore that aspect further. At runtime, an enum simply functions as an object with keys and values. Specifically, when utilizing a string enum, the keys and values will match the defined key-value pairs.

(In the case of a numeric enum, there are also reverse mappings where the value acts as a key and vice versa. While this might be confusing, it doesn't directly relate to your inquiry so I'll refrain from delving into it unless requested.)

The similarity between the keys and values in your enum introduces ambiguity that should be avoided. To address this, let's redefine UserRole as follows:

enum UserRole {
    ADMIN = "admin",
    ACTIVE = "active",
    BLOCKED = "blocked",
}

This enables us to distinguish between whether a given string is a key or value within the enum. For instance, to determine if a provided string role is a key in the enum, we can employ the following approach:

const roleIsEnumKey = role in UserRole;
console.log("role " + role + (roleIsEnumKey ? " IS " : " IS NOT ") + "a key in UserRole");

Similarly, to ascertain if the string corresponds to a value in the enum, you can use:

const roleIsEnumValue = (Object.values(UserRole) as string[]).includes(role);
console.log("role " + role + (roleIsEnumValue ? " IS " : " IS NOT ") + "a value in UserRole");

Assuming your JavaScript version supports Object.values() and Array.prototype.includes(), you can verify the keys and values. Otherwise, feel free to iterate over Object.keys() or any preferred method.

To test the functionality:

check(JSON.stringify({ role: "ADMIN" }));
// role ADMIN IS a key in UserRole 
// role ADMIN IS NOT a value in UserRole

check(JSON.stringify({ role: "admin" }));
// role admin IS NOT a key in UserRole 
// role admin IS a value in UserRole 

check(JSON.stringify({ role: "random" }));
// role random IS NOT a key in UserRole
// role random IS NOT a value in UserRole

Seems effective. Ultimately, at runtime, the enum behaves like an object, allowing inspection of its keys and values similar to any other object.

Playground link

Answer 3

Answer №2

JS does not natively support Enums, so when using TypeScript, Enum definitions are converted to regular JS objects during compilation. This means that there is no specific Enum data structure in JavaScript for you to directly access or inspect.

For example, the following Enum definition:

enum UserRole {
    admin = "admin",
    active = "active",
    blocked = "blocked"
}

Gets translated to something similar to this:

var UserRole;
(function (UserRole) {
    UserRole["admin"] = "admin";
    UserRole["active"] = "active";
    UserRole["blocked"] = "blocked";
})(UserRole || (UserRole = {}));

Answer 4

JS does not natively support Enums, so when using TypeScript, Enum definitions are converted to regular JS objects during compilation. This means that there is no specific Enum data structure in JavaScript for you to directly access or inspect.

For example, the following Enum definition:

enum UserRole {
    admin = "admin",
    active = "active",
    blocked = "blocked"
}

Gets translated to something similar to this:

var UserRole;
(function (UserRole) {
    UserRole["admin"] = "admin";
    UserRole["active"] = "active";
    UserRole["blocked"] = "blocked";
})(UserRole || (UserRole = {}));

Answer 5

Answer №3

According to @NearHuscarl, it is impossible to verify that. Nevertheless, you have the option to confirm whether djson.role (string) corresponds to any of the UserRole (enum) values:

!!(Object.values(UserRole).find(enumValue => enumValue === djson.role)));

Answer 6

According to @NearHuscarl, it is impossible to verify that. Nevertheless, you have the option to confirm whether djson.role (string) corresponds to any of the UserRole (enum) values:

!!(Object.values(UserRole).find(enumValue => enumValue === djson.role)));

Answer 7

Answer №4

When dealing with an enum, it's important to remember that the value can be either a string or number. Therefore, testing against both types is essential.

To address this, we can establish a User-Defined Type Guard as follows:

function isInstance<T extends object>(value: string, type: T): type is T {
    return Object.values(type).includes(value)
}

This function will evaluate to true or false based on whether the value exists in the enum. However, it may not work best for enums where numbers and strings overlap.

enum Animal {
    Cat = 'cat',
    Dog = 'dog'
}

enum Plant {
    Tree = 'tree',
    Flower = 'flower'
}

function isInstance<T extends object>(value: string | number, type: T): type is T {
    return Object.values(type).includes(value)
}

console.log(isInstance('dog', Animal)) // True
console.log(isInstance('dog', Plant))  // False

Answer 8

When dealing with an enum, it's important to remember that the value can be either a string or number. Therefore, testing against both types is essential.

To address this, we can establish a User-Defined Type Guard as follows:

function isInstance<T extends object>(value: string, type: T): type is T {
    return Object.values(type).includes(value)
}

This function will evaluate to true or false based on whether the value exists in the enum. However, it may not work best for enums where numbers and strings overlap.

enum Animal {
    Cat = 'cat',
    Dog = 'dog'
}

enum Plant {
    Tree = 'tree',
    Flower = 'flower'
}

function isInstance<T extends object>(value: string | number, type: T): type is T {
    return Object.values(type).includes(value)
}

console.log(isInstance('dog', Animal)) // True
console.log(isInstance('dog', Plant))  // False

Ways to determine if the type is an enum in TypeScript

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

Using Karma-Jasmine to Import Spy without anyImplicitAny

Adjust the height of a div vertically in Angular 2+

The element does not recognize the property 'width' since it is not defined in the type of 'GlobalEventHandlers'

Typescript's Intersection Types: The Key to Overlapping Properties

Retrieving the Final Value from an Observable in Angular 8

Enhancing Angular2 authentication with Auth0 for enabling Cross-Origin Resource Sharing

Modifying data within nested objects using Typescript

Converting <reference path/> directive to ESM import: A step-by-step guide

Exciting Angular feature: Dynamic Titles

Having trouble with React npm start: 'No chokidar version found' error occurring

The functionality of routerLink is not functioning as expected when used on button elements

The routerlink feature consistently directs back to the default page

Is it possible to extract specific columns from the Convex database?

Utilizing images in a compiler run with the option of `allowJS:true` is key

Setting up Typescript for a Node.js project configuration

New to React and struggling with updating the DOM

Managing singleton instances in TypeScript and NextJs across multiple files

Is it possible to define TypeScript interfaces in a separate file and utilize them without the need for importing?

Declaring a subclass type in Typescript: A step-by-step guide

Strange activities observed during the management of state in react hooks, where the splice() function ends up eliminating the