Typescript Enums

shagun_mistry

Shagun Mistry

Posted on August 27, 2024

Typescript Enums

Enums, short for enumerations, are a powerful feature in TypeScript that allow you to define a set of named constants. This can be incredibly useful when you want to represent a limited set of choices or options within your code.

Enums can make your code more readable, maintainable, and less prone to errors.

Imagine you're building a simple online store. You need to represent the different payment methods your customers can choose from:

// Without enums
const PAYMENT_METHOD_CARD = "card";
const PAYMENT_METHOD_PAYPAL = "paypal";
const PAYMENT_METHOD_APPLEPAY = "applepay";

// ... later in your code ...
if (paymentMethod === PAYMENT_METHOD_CARD) {
  // Process card payment
} else if (paymentMethod === PAYMENT_METHOD_PAYPAL) {
  // Process Paypal payment
}
Enter fullscreen mode Exit fullscreen mode

This approach works, but it's a bit verbose and prone to typos.

This is where Enums come handy!

// Using enums
enum PaymentMethod {
  Card = "card",
  Paypal = "paypal",
  ApplePay = "applepay",
}

// ... later in your code ...
if (paymentMethod === PaymentMethod.Card) {
  // Process card payment
} else if (paymentMethod === PaymentMethod.Paypal) {
  // Process Paypal payment
}
Enter fullscreen mode Exit fullscreen mode

Here's why enums are so awesome:

  • Readability: Instead of using magic strings, you have clearly defined names like PaymentMethod.Card which make your code much easier to understand.
  • Type Safety: TypeScript will flag any errors if you try to use an invalid payment method, preventing runtime issues.
  • Maintainability: If you need to add a new payment method, you only need to add it to the enum definition, ensuring consistency across your codebase.

Let's put it into action with a practical code example:

enum PaymentMethod {
  Card = "card",
  Paypal = "paypal",
  ApplePay = "applepay",
}

function processPayment(paymentMethod: PaymentMethod) {
  if (paymentMethod === PaymentMethod.Card) {
    console.log("Processing card payment...");
  } else if (paymentMethod === PaymentMethod.Paypal) {
    console.log("Processing Paypal payment...");
  } else if (paymentMethod === PaymentMethod.ApplePay) {
    console.log("Processing ApplePay payment...");
  }
}

processPayment(PaymentMethod.Paypal); // Output: Processing Paypal payment...
Enter fullscreen mode Exit fullscreen mode

Isn't that neat?

Enums bring structure and clarity to your code, making it easier to manage and less error-prone.

💖 💪 🙅 🚩
shagun_mistry
Shagun Mistry

Posted on August 27, 2024

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

Typescript Enums
typescript Typescript Enums

August 27, 2024