Use TypeScript Enums in Classes: A Complete Guide

While developing an online shopping application, a developer needs to manage different order statuses, such as Pending, Shipped, Delivered, and Cancelled. To keep the code clean and consistent, they create a TypeScript enum called OrderStatus and use it inside a class named Order.

In this tutorial, we will learn how to effectively use TypeScript enums in classes to organize the TypeScript code and improve readability.

Enums allow a developer to define a set of named constants, making it easier to document intent and create distinct cases. You can create more structured and maintainable code by incorporating enums in your classes.

Table of Contents

Understand Enums in TypeScript

Before discussing using enums in classes, let’s briefly review what TypeScript enums are. Enums are powerful tools that group related values together, giving your code better structure and readability.

There are three types of enums in TypeScript:

Numeric Enums: These enums assign numeric values to each member. By default, the first member starts at 0 and increments by 1 for each subsequent member.
String Enums: These enums assign string values to each member, providing more meaningful and readable values.
Heterogeneous Enums: These enums can have a mix of numeric and string values, allowing for flexibility in defining members.

Use TypeScript Enums in Classes

Now, let’s explore how to incorporate enums within classes. Enums can be defined inside a class to group related constants together and improve code organization. Here’s an example:

// Define the enum outside the class
enum AccountType {
  Free = 'FREE',
  Premium = 'PREMIUM',
  Enterprise = 'ENTERPRISE'
}

class UserAccount {
  constructor(public accountType: AccountType) {}

  getAccountFeatures() {
    switch (this.accountType) {
      case AccountType.Free:
        return ['Basic Dashboard', 'Limited Reports'];
      case AccountType.Premium:
        return ['Advanced Dashboard', 'Unlimited Reports', 'Priority Support'];
      case AccountType.Enterprise:
        return ['Custom Dashboard', 'Dedicated Support', 'API Access'];
    }
  }
}

// Example usage
const user1 = new UserAccount(AccountType.Free);
console.log(user1.getAccountFeatures()); // ['Basic Dashboard', 'Limited Reports']

const user2 = new UserAccount(AccountType.Enterprise);
console.log(user2.getAccountFeatures()); // ['Custom Dashboard', 'Dedicated Support', 'API Access']

In this example, we define an AccountType enum inside the UserAccount class. The enum represents the different types of user accounts available in our application. By encapsulating the enum within the class, we keep it closely related to the class’s functionality.

The UserAccount class constructor takes an accountType parameter of type AccountType, ensuring that only valid account types can be assigned.

The getAccountFeatures method uses a switch statement to determine the features associated with each account type, providing a clear and readable way to handle different cases.

Check out: Convert TypeScript Enum to String

Real-World Use Case in TypeScript: Subscription Tiers

Let’s explore a real-world use case where using enums in classes can be beneficial. Consider a subscription-based application with different subscription tiers. We can use enums to define the subscription tiers and their associated features.

// Define the enum outside the class
enum Tier {
  Basic = 'BASIC',
  Pro = 'PRO',
  Enterprise = 'ENTERPRISE'
}

class SubscriptionTier {
  constructor(public tier: Tier) {}

  getMonthlyPrice() {
    switch (this.tier) {
      case Tier.Basic:
        return 9.99;
      case Tier.Pro:
        return 19.99;
      case Tier.Enterprise:
        return 49.99;
    }
  }

  getFeatures() {
    switch (this.tier) {
      case Tier.Basic:
        return ['10 Projects', '5 GB Storage', 'Email Support'];
      case Tier.Pro:
        return ['Unlimited Projects', '20 GB Storage', 'Priority Email Support'];
      case Tier.Enterprise:
        return ['Unlimited Projects', '100 GB Storage', 'Phone & Email Support'];
    }
  }
}

// Example usage
const sub = new SubscriptionTier(Tier.Pro);
console.log(sub.getMonthlyPrice()); // 19.99
console.log(sub.getFeatures());     // ['Unlimited Projects', '20 GB Storage', 'Priority Email Support']

In this example, the SubscriptionTier class represents the available subscription tiers. The Tier enum defines the available tiers: Basic, Pro, and Enterprise. The getMonthlyPrice and getFeatures methods use switch statements to determine the pricing and features associated with each tier.

By using enums in this way, we have a clear and organized structure for handling different subscription tiers. The code is also more readable and maintainable, as the enum values serve as self-documenting constants.

Use TypeScript Enums in Classes A Complete Guide

Check out: Convert TypeScript Enums to Arrays

Advanced Enum Techniques in TypeScript

In addition to basic enum usage, TypeScript offers advanced techniques for working with enums. One such technique is recreating advanced enum types. This involves using TypeScript’s type system to create more expressive and flexible enums.

Here’s an example of an advanced enum technique:

type UserRole = 'Admin' | 'Manager' | 'User';

class User {
  constructor(public name: string, public role: UserRole) {}

  getPermissions() {
    switch (this.role) {
      case 'Admin':
        return ['Create', 'Read', 'Update', 'Delete'];
      case 'Manager':
        return ['Create', 'Read', 'Update'];
      case 'User':
        return ['Read'];
    }
  }
}

In this example, instead of using a traditional enum, we define a UserRole type that represents the possible user roles. The User class takes a role parameter of type UserRole, ensuring only valid roles can be assigned. The getPermissions method uses a switch statement to determine the permissions associated with each role.

This advanced enum technique provides more flexibility and type safety, leveraging TypeScript’s type system to define the possible values for the UserRole type.

Conclusion

Using TypeScript enums in classes is a powerful way to organize your code and improve readability. By grouping related constants and encapsulating them within classes, you can create more structured and maintainable code.

Throughout this tutorial, we explored the different types of enums, how to incorporate enums in classes, and real-world use cases such as subscription tiers. We also touched upon advanced enum techniques that leverage TypeScript’s type system for more expressive and flexible enums.

Remember, while enums have faced some criticism lately, they still serve a valuable purpose when used judiciously. When applied appropriately, enums can greatly improve the structure and readability of your TypeScript code.