Enum in TypeScript

In this article I am going to explain how to use enum in TypeScript.

TypeScript Enum

 
An Enum is a set of named constants. It provides a way to create symbolic constants, especially for a set of related constants, such as the day of the week (Monday, Tuesday and so on...) or say an enum stores special values. They make a program simpler and improve readability.
 
Example of enum
 
In this example, we see an enum type that indicates the importance of something.
 
The following examples show the use of enum in TypeScript, use the following to create a program using enum.
 
Step 1
Open Visual Studio 2012 and click on "File" menu -> "New" -> "Project". A window is opened. Provide the name of your application like "app", then click on the Ok button.
 
Step 2
After Step 1 your project has been created. The Solution Explorer, which is at the right side of Visual Studio, contains the js file, ts file, CSS file, and Html files.
 
Step 3
The code of enum program.
 

app.ts

  1. enum days {  
  2.  sun = 1, mon, tue, wed, thu, fri, sat  
  3. }  
  4. class abc {  
  5.  function() {  
  6.   var x: number = days.sat;  
  7.   var y: number = days.tue;  
  8.   document.write("Sat=" + x + "</br>Tue=" + y);  
  9.  }  
  10. }  
  11. window.onload = () => {  
  12.  var call = new abc();  
  13.  call.function();  
  14. }  
Step 4
 
Output
 
enum-in-typescript.jpg
 

Why we use enum?

 
Reduces errors caused by transposing or mistyping a number.
 
It makes it easy to change values in the future.
 
Enums are not allocated in memory. They exist only during compilation.
 
Since you will get an error during compile time itself, not run time, it is better and a best practice.
 
Languages that do not have an enumerator feature often rely on error-prone and unclear schema for representing groups of constants.  
  1. enum color {  
  2.  red,  
  3.  green,  
  4.  blue,  
  5.  white,  
  6.  yellow  
  7. }  
  8. class abc {  
  9.  abc(wall: color) {  
  10.   if (wall == color.red) {  
  11.    document.write("Color of wall is red.");  
  12.   }  
  13.   if (wall == 0) {  
  14.    document.write("</br>Color of wall is also red.");  
  15.   }  
  16.  }  
  17. }  
  18. window.onload = () => {  
  19.  var call = new abc();  
  20.  call.abc(0);  
  21. }  
Note: In the above example color is the name of a new custom made type. It is called an enumeration. By using the dot. operator, "color.red" is a symbolic constant for int or say the number value 0. "color.green" is a symbolic constant for the number value 1 and so on. These symbolic constants are called enumerators or numbers of the enumeration. The number or int values start from 0 and increment by 1 (0,1,2,3....so on) for each enumeration number by default. Here "color.red" has the int value 0 so both conditions are true.
 
Output
 
enum1-in-typescript.jpg
 
Here, I have five colors in the enum, 0 (by default enum variables values start from zero however you can change that depending on your requirements) stands for red, 1 stand for green, 2 stands for blue and so on. If you want to decide the color of a wall then now see two given conditions:
 
if(wall==1) // condition 1
 
instead  of
 
if(wall==color.green) // condition 2
 
Condition 2 is better than 1 because it is self-describing and clear.
 

Summary

 
The latter is much clearer and understandable. To improve the clarity and self-documentation and to reduce the probability of invalid values in your source code, use enumerations when you know all possible values of a variable before the program is compiled.