Enums in TypeScript

Introduction

An enum in typescript is a special "class" that represents a group of constants. Enums define a set of named constants, by default enums begin numbering their elements from 0 but we can also change this by manually setting the value of one of its elements. Typescript gets support for enums from ES6. We can simply declare an enum by using the keyword enum. Now let's read in detail about the different types of enums. There are three types of Enums in TypeScript. These are:

• Numeric Enums
• String Enums
• Heterogeneous Enums

Numeric Enums in Typescript

Numeric enums are number-based enums, that store values as numbers.

Numeric Enums-Default

By default, enums will initialize the first value to 0 and add 1 to each additional value.

Output

As we know that Top is the first value so the answer is 0. Run this code in your editor for a better explanation.

Numeric Enums -Initialized

We can set the value of the first numeric enum and then the enum member will auto-increment from there. Let's see an example:

OUTPUT

Since we have now initialized the value of the enum so the enum member will start auto-incrementing from that no. Run the above code in your editor for a better and clear explanation.

Numeric Enums - Fully Initialized

We can assign a value for each enum value, by doing this it will not start incrementing automatically. Let's see an example:

Output

Since we have initialized each and every value of the enum in typescript so it will just print the initialized values which have been declared.

String Enums

Enums in typescript can contain strings also, they are more common than numeric enums because of their readability. In a string enum, each member has to be constant-initialized with a string literal, or with another string enum member. Now lets see an example of string enums.

Output

Heterogeneous Enums

Heterogeneous enums in typescript are enums that contain both string and numeric values. Now lets see an example of heterogenous enums

Output

We should not use heterogeneous enums unless we are really trying to take advantage of JavaScript’s runtime behavior in a clever way. Run the above code in your editor for a better and clear explanation.

Computed and Constant Members

The value of an enum member can be either a constant or computed. An enum member is considered constant if it is the first member in the enum and it has no initializer, in which case it is assigned to the value 0. It does not have an initializer and the preceding enum member was a numeric constant. In that case, the value of the current enum member will be the value of the preceding enum member plus one. Let's see an example of constant enums:

All the enum members in Directions are constant. Now let's see an example of computed enums:

Output

In the above example the output is 4 because the length of the word is 4 . Run the code in your editor for a better explanation.

Union Enums and Enum Member Types

The body of an enum type declaration defines zero or more enum members, which are the named constants of the enum type. A literal enum member is a constant enum member with no initialized value, or with values that are initialized to any string literal, any numerical literal, and a unary minus applied to any numeric literal. Enum members can also become types as well. Let's see an example:

Output

Now the other change is that enum types themselves effectively become a union of each enum member. Because of that, TypeScript can catch bugs where we might be comparing values incorrectly. Let's see an example

Output

In that example, we first checked whether the direction was not direction. North. If that check succeeds, then our ||(logical or) will short-circuit, and the body of the ‘if’ will run. However, if the check didn’t succeed, then direction can only be the direction. North, so it doesn’t make sense to see whether it’s equal to direction.South.Run the above code in your editor for a better and clear explanation.

Enums at Runtime

Enums are the real objects which exist at runtime. Let's understand it with the help of an example

It can also be passed to function lets see an example below:

Run the above code in your editor for a better and clear explanation.

Enums at Compile Time

We know enums are real objects that exist at runtime, the keyof keyword works differently than you might expect for typical objects. Let's see an example:

Ambient Enums

Ambient enums are used for describing the shape for already existing enum types. Lets us understand this with the help of an example:

There is only one difference between the ambient enums and non-ambient enums which are in regular enums members that do not have an initializer are considered constant if its preceding enum member is considered constant. But in an ambient enum member that does not have an initializer is always considered as computed enums.

Objects vs Enums

In typescript we do not need an object with asconst is there. Let's see this with the help of an example:

An enum as a type hint says "the variable may take one of the values in this list". An enum as an object makes those values easily accessible by something like constants. Run the above code in your editor for a better and clear explanation.