Enums in TypeScript: A Comprehensive Guide

Enums in TypeScript: A Comprehensive Guide

ยท

3 min read

Introduction

  • TypeScript, a superset of JavaScript, adds static types and other features to enhance the developer experience.

  • One of these powerful features is Enums. Enums allow us to define a set of named constants, making our code more readable and maintainable.

In this blog, we'll dive deep into the world of Enums in TypeScript, understand their usage, and see some real-life examples to grasp their utility better.

What are Enums?

  • Enums (short for Enumerations) are a way to organize a collection of related values.

  • They provide a handy way to define a set of named values that can be used as a type in TypeScript.

  • This helps in creating clear, intent-revealing code.

Why Use Enums?

Enums offer several benefits:

  • Readability: Enums make the code more readable and understandable by providing meaningful names for sets of values.

  • Maintainability: Using Enums helps avoid magic numbers or strings scattered throughout the code.

  • Type Safety: Enums allow TypeScript to catch errors at compile time.

Defining Enums

Let's start with a basic example to understand how Enums are defined and used.

enum Direction {
    North,
    South,
    East,
    West
}

// Using the Enum
let currentDirection: Direction = Direction.North;

console.log(currentDirection); // Output: 0

In the above example, we defined an Enum Direction with four possible values: North, South, East, and West. By default, the values are auto-incremented starting from 0.

String Enums

TypeScript also supports string Enums, which can be more readable when debugging.

enum Status {
    Pending = "PENDING",
    InProgress = "IN_PROGRESS",
    Completed = "COMPLETED",
    Failed = "FAILED"
}

// Using the Enum
let currentStatus: Status = Status.InProgress;

console.log(currentStatus); // Output: IN_PROGRESS

String Enums allow us to explicitly define the values associated with each name.

Heterogeneous Enums

TypeScript allows Enums to contain both string and numeric values, known as heterogeneous Enums.

enum Response {
    No = 0,
    Yes = "YES"
}

let res: Response = Response.Yes;

console.log(res); // Output: YES

While heterogeneous Enums are less common, they can be useful in certain situations.

Real Life Example: Order Status

Consider an e-commerce application where we need to manage the status of orders. Enums can help us define these statuses clearly.

enum OrderStatus {
    Placed = "PLACED",
    Shipped = "SHIPPED",
    Delivered = "DELIVERED",
    Cancelled = "CANCELLED"
}

function updateOrderStatus(status: OrderStatus): void {
    console.log(`Order is now ${status}`);
}

// Updating order status
updateOrderStatus(OrderStatus.Shipped); // Output: Order is now SHIPPED
updateOrderStatus(OrderStatus.Cancelled); // Output: Order is now CANCELLED

In this example, the OrderStatus Enum makes the code more readable and manageable.

Conclusion

  • Enums in TypeScript are a powerful feature that adds to the language's type safety and code readability.

  • They provide a way to define a set of named constants, making the code easier to understand and maintain.

  • Whether you are dealing with simple value sets or more complex scenarios, Enums can significantly enhance your TypeScript code.

Thank You Everyone For The Read ....

Happy Coding! ๐Ÿคž๐Ÿ’ป


๐Ÿ‘‹ Hello, I'm Aaryan Bajaj .

๐Ÿฅฐ If you liked this article, consider sharing it.

๐Ÿ”— X | LinkedIn

ย