TypeScript Enums allows you to create a list of constants (unchanging variables) and give them easy-to-remember names. These names make your code easier to read and understand by grouping related values together under one name. Enums can use both numbers and text, so you can choose what works best for your code.
- Easy-to-remember names: Replace hard-to-understand numbers or strings with meaningful names.
- Group-related values: Keep similar values organized under a single identifier for better code structure.
Types of Enums in TypeScript
TypeScript provides two main types of enums: Numeric and String enums.
1. Numeric Enums
Numeric enums are the default in TypeScript. Each member of a numeric enum is assigned a numeric value, starting from 0 by default, but you can customize these values as needed.
Default Numeric Enums:
In default numeric enums, the first member is assigned the value 0, and each subsequent member is incremented by 1.
JavaScript
enum Direction {
Up,
Down,
Left,
Right
}
let move: Direction = Direction.Up;
console.log(move);
- First member is 0: Direction.Up is 0.
- Auto-increment: Direction.Down is 1, Direction.Left is 2, and so on.
Output:
0
Initialized Numeric Enums:
You can assign a specific value to the first member, and subsequent members will auto-increment from that value.
JavaScript
enum Direction {
Up = 1,
Down,
Left,
Right
}
let move: Direction = Direction.Up;
console.log(move);
- Custom start: Direction.Up is set to 1.
- Auto-increment continues: Direction.Down becomes 2, Direction.Left becomes 3, etc.
Output:
1
Fully Initialized Numeric Enums:
Each member can be assigned a unique numeric value, independent of its position.
JavaScript
enum Direction {
Up = 1,
Down = 3,
Left = 5,
Right = 7
}
let move: Direction = Direction.Up;
console.log(move);
- Each member has a specific value: Up is 1, Down is 3, Left is 5, and Right is 7.
- Logging Direction.Up outputs its assigned value, 1.
Output:
1
2. String Enums
String enums allow you to assign string values to each member, providing meaningful names that enhance code clarity.
JavaScript
enum Direction {
Up = "UP",
Down = "DOWN",
Left = "LEFT",
Right = "RIGHT"
}
let move: Direction = Direction.Up;
console.log(move);
- Each member is assigned a descriptive string value.
- Logging Direction.Up outputs "UP".
Output:
"UP"
3. Heterogeneous Enums
TypeScript also supports heterogeneous enums, where you can mix both numeric and string values in the same enum. However, this is not commonly used because it can make the code less consistent and harder to maintain.
JavaScript
enum Status {
Active = 1,
Inactive = "INACTIVE",
Pending = 2,
Cancelled = "CANCELLED"
}
let currentStatus: Status = Status.Active;
console.log(currentStatus); // Output: 1
let cancelledStatus: Status = Status.Cancelled;
console.log(cancelledStatus); // Output: "CANCELLED"
- Mix of numbers and strings: Members can have either numeric or string values.
- Less common: Not recommended for most cases as it reduces consistency.
Best Practices of Using TypeScript Enums
- Use clear and descriptive names: Give enum members meaningful names to make your code easier to read and understand.
- Prefer const enums for performance: Use const enums in performance-critical code to reduce runtime overhead.
- Avoid mixing numbers and strings: Stick to either numeric or string enums for consistency and simplicity.
- Use string enums for better debugging: String enums provide meaningful values that make debugging easier.
Similar Reads
TypeScript Enums Type TypeScript Enums Type is not natively supported by Javascript, but it's a notable feature of the Typescript Programming language. In general, enumerations shortly called "enum" are available in most programming languages to create named consonants. Enums allow us to create a set of named constants,
5 min read
How enums works in TypeScript ? In this article, we will try to understand all the facts which are associated with enums in TypeScript. TypeScript enum: TypeScript enums allow us to define or declare a set of named constants i.e. a collection of related values which could either be in the form of a string or number or any other da
4 min read
Enums in JavaScript Enums in JavaScript are used to define a set of named constants and make your code more readable and easier to understand. Instead of using random numbers or strings, enums give meaningful names to values, helping you avoid errors and improve maintainability. They're a simple way to group related va
4 min read
Opaque Types In TypeScript In TypeScript Opaque types concept allows for the definition of specialized types such as strings or numbers which are derived from primitive types but do not have the characteristics of the base types, the purpose of this is to prevent specific actions regarding the type in question, or to make thi
4 min read
Data types in TypeScript In TypeScript, a data type defines the kind of values a variable can hold, ensuring type safety and enhancing code clarity.Primitive Types: Basic types like number, string, boolean, null, undefined, and symbol.Object Types: Complex structures including arrays, classes, interfaces, and functions.Prim
3 min read