{

Typescript Enum tutorials - Best Examples


Typescript Enum Tutorials with examples

Enum type in typescript

Enum is one of the latest features of typescript language. It is one data type that holds the same value or different types. It groups similar values into one entity.

Enum feature is there in all other programming languages like Java and Microsoft Net. Javascript has no Enum feature.

Enum is a keyword used to construct the enum object.

You can check my other posts on typescript Enum object.

Plain Enum Example

Let’s declare enum in typescript.

enum Status {  
    Done,  
    Error,  
    Exception,  
}  

This simple plain Enum example, which emits to the following table during javascript compilation process

var Status;  
(function (Status) {  
    Status[Status["Done"] = 0] = "Done";  
    Status[Status["Error"] = 1] = "Error";  
    Status[Status["Exception"] = 2] = "Exception";  
})(Status || (Status = {}));  
console.log(Status.Done);  

declare const in enum constants

declare const enum Status {  
    Done,  
    Error,  
    Exception,  
}

The above code will not emit any code during javascript compilation. The same case applies with declaring enum or const enum

Enum Number Example

If no type is assigned to the values in an Enum, it is treated as a numeric enum.

Please see the example below.

enum WeekDay {  
    Sunday,  
    Monday,  
    Tuesday,  
    Wednesday,  
    Thursday,  
    Friday,  
    Saturday  
}  
conso.log(WeekDay.Sunday) - outputs 0  
conso.log(WeekDay.Wednesday) - outputs 3  
conso.log(WeekDay.Saturday) - outputs 6  

We declared Enum with 7 values. Enum values declared are treated as Numbers by default. You can explicitly set the numbers only. This is a plain Enum example. The compiler generates the following javascript code.

var WeekDay;  
(function (WeekDay) {  
    WeekDay[WeekDay["Sunday"] = 0] = "Sunday";  
    WeekDay[WeekDay["Monday"] = 1] = "Monday";  
    WeekDay[WeekDay["Tuesday"] = 2] = "Tuesday";  
    WeekDay[WeekDay["Wednesday"] = 3] = "Wednesday";  
    WeekDay[WeekDay["Thursday"] = 4] = "Thursday";  
    WeekDay[WeekDay["Friday"] = 5] = "Friday";  
    WeekDay[WeekDay["Saturday"] = 6] = "Saturday";  
})(WeekDay || (WeekDay = {}));  

Enum String example

Enumeration for String is like numeric. It has initialized values at compile time.

enum Month {  
    Jan='January',  
    Feb = 'February',  
    Mar='March'  
}  
console.log(Month.Jan) -- returns January  

Typescript Enum examples

will walk through the different examples using the enum keyword

How to Iterate elements of an enumeration?

using for loop, we can iterate all the elements of Enum data type

for (let month in Month) {  
    const myMonth: Month = Month[month] as Month;  
    console.log(myMonth)  
}  
output is   
January  
February  
March  

How to Convert String to Enumeration in typescript?

It is easy to convert to String to Enum or Enum to String as described in the sample code. Enumeration by defaults returns numeric index. You can look up the corresponding Enum by Index and return it as String type.

 enum Month {  
    Jan,  
    Feb ,  
    Mar  
}  
// To String  
var selectedMonth: string = Month[Month.Jan];  
 console.log(selectedMonth) // return the Enum in String  
  
// To Enum / number  
var month : Month = Month[selectedMonth];  
 console.log(selectedMonth) // String to  Enum Object

How to convert Enum to Array Object?

It is very easy to convert to Array Object_ First, create an empty array and You just have to iterate enum and push these values to Enum.

let map: {code: string; name: string}[] = [];  
  
for(var n in Month) {  
        map.push({code: Month[n], name: n});  
}  
console.log(map);

Summary

To Sum up, You learned Typescript enum and examples with explanations.

THE BEST NEWSLETTER ANYWHERE
Join 6,000 subscribers and get a daily digest of full stack tutorials delivered to your inbox directly.No spam ever. Unsubscribe any time.

Similar Posts
Subscribe
You'll get a notification every time a post gets published here.