How to get names and values of enum in typescript

How to get names and values of enum in typescript

In this article, we’ll see what is enum or enumeration and why it’s used and we’ll also see how to get names and values of enum in typescript.

What are Enums?

In typescript enum is available from typescript version 2.4.

Enum or Enumeration allowed us to declare set of named constants.

Enum is a collection of value the can be of type string or numeric as a named constants.

Why Enums are used?

Enum is used when you’ve set of choices that you’re using across the applications. so the set of choices that belongs together can be grouped in enum.

Enum for multiple constants

For example, instead of using multiple const

const directionUp = 1; const directionDown = 2; const directionLeft = 3; const directionRight = 4;

We can use the following enum instead of the above code.

enum Direction { Up = 1, Down, Left, Right }

There are some advantages of using enum:

  • All the direction related constants are grouped and nested inside Direction.
  • We can use Direction anywhere where we need the constant and typescript to check statically that no other values can be used.

Enum for user permission

Enum can be used for user permission.

enum Permissions { None = 0, Read = 1, Write = 2, Delete = 4 }

This enum is power of 2. so that we can write something like:

var permissions = Permission.Read | Permission.Write

If we see this enum in bit fields, it’ll looks something like:

Permissions.Read == 1 == 00000001 Permissions.Write == 2 == 00000010 Permissions.Delete == 4 == 00000100

so our statement

var permissions = Permission.Read | Permission.Write

will become

var permissions = 00000001 | 00000010 = 00000011

Both the Read and Write bits are set, and I can check that independently (Also notice that the Delete bit is not set and therefore this value does not convey permission to delete).

In short, our enum is a shorter way to writeL

public enum Permissions { DeleteNoWriteNoReadNo = 0, // None DeleteNoWriteNoReadYes = 1, // Read DeleteNoWriteYesReadNo = 2, // Write DeleteNoWriteYesReadYes = 3, // Read + Write DeleteYesWriteNoReadNo = 4, // Delete DeleteYesWriteNoReadYes = 5, // Read + Delete DeleteYesWriteYesReadNo = 6, // Write + Delete DeleteYesWriteYesReadYes = 7, // Read + Write + Delete }

Type of Typescript Enums

There are three types of enum in typescript:

  • Numeric Enum
  • String Enum
  • Heterogenous Enum

Numeric Enum

By default typescript enum are numeric enum.

enum Direction { Up, Down, Left, Right }

In the above example, we didn’t initialise the value of enum so by default Up will be having value 0 and Down will have 1 and for all following member will have auto-incremented values.

so it’ll be having following values:

  • Up = 0
  • Down = 1
  • Left = 2
  • Right = 3

We can also initialise by setting the value as following:

enum Direction { Up = 4, Down, Left, Right }

so it’ll. be having the following values:

  • Up = 4
  • Down = 5
  • Left = 6
  • Right = 7

How to get names from numeric enum?

Enum is basically an object. Numeric enums not only create object with property names for enum member but also create a reverse mapping from enum values to enum name.

For example,

enum Enum { A } let a = Enum.A; let nameOfA = Enum[a]; // "A"

so if we’ll log our direction enum, it’ll output the following result.

{ 1: "Up" 2: "Down" 3: "Left" 4: "Right" Down: 2 Left: 3 Right: 4 Up: 1 }

so you can see that reverse mapping is also created in numeric enum.

Now if we want to get the name of enum by values, we can do the following iteration:

for (var enumMember in Direction) { var isValueProperty = parseInt(enumMember, 10) >= 0; if (isValueProperty) { console.log("enum member: ", Direction[enumMember]); } }

Output

enum member: Up enum member: Down enum member: Left enum member: Right

To get the individual member name you can do something like;

console.log(Direction[1])

String Enums

String enum is similar to numeric enum but with small difference. With string enum, each member has to constant initialized with string literal or with another string enum member.

enum Direction { Up = "UP-DIRECTION", Down = "DOWN-DIRECTION", Left = "LEFT-DIRECTION", Right = "RIGHT-DIRECTION" }

How to get names from string enum?

For string enum, you can get the name directly by iterating enum through for loop because string enums directly store key value pairs in enum object.

for (var enumMember in Direction) { console.log("enum member: ",enumMember); }

Output

enum member: Up enum member: Down enum member: Left enum member: Right

Heterogeneous enums

Enum can be mixed. It can have numeric as well as string values. This type enum is known as Heterogeneous enums.

For example,

enum Direction { Up = 1, Down = "DownValue", Left = 3, Right = "RightValue" }

How to get names from Heterogeneous enum?

We’ll first see how typescript create an object for Heterogeneous enum.

If you’ll log above enum, it’ll show the following output:

{ 1: "Up" 3: "Left" Down: "DownValue" Left: 3 Right: "RightValue" Up: 1 }

Here you can see that for the numeric member, typescript created object with reverse mapping as well.

To get the name of Heterogeneous enum member, use the following implementation:

for (var enumMember in Direction) { var isValueProperty = parseInt(enumMember, 10) >= 0; if (!isValueProperty) { console.log("enum member: ", enumMember); } }

Output

enum member: Up enum member: Down enum member: Left enum member: Right

That’s is for enum and getting names and values of enum for Numeric, String or Heterogeneous enums.

Enum Typescript: FAQ

Typescript Enum – Frequently Asked Questions(FAQ)

What are the type of enum in typescript?

  • Numeric Enums
  • String Enumns
  • Heterogeneous Enums

What are Enums?

Enum or Enumeration allowed us to declare set of named constants.

I hope you like this article.

Also Read: