{ Soham Kamani }

About Blog Github Twitter

🌙
☀️

Using Enums (Enumerations) In Javascript

Updated on

This post will explain how to implement and use enumerations (or enum types) in Javascript.

banner image

Enums are types that contain only a limited number of fixed values, as opposed to types like Number or String which can have a wide range of values.

This is useful for many situations: For example, when describing seasons in temperate climates, you’ll want to limit the options to certain possible values: Summer, Winter, Spring and Autumn.

Let’s look at different ways of implementing this type of data:

Naive Implementation

The simplest way to implement enums for season options is to create a constant for each season:

// Number mapping
const Summer = 0
const Autumn = 1
const Winter = 2
const Spring = 3

// String mapping
const Summer = "summer"
const Autumn = "autumn"
const Winter = "winter"
const Spring = "spring"

While this would work for small codebases, we will face a few immediate issues:

  1. It’s easy to make mistakes in your code. A developer can make the mistake of using integers outside the range of the ones defined.

  2. Definitions from unrelated enums can overlap and cause conflicts:

    const Summer = 0
    const Autumn = 1
    const Winter = 2
    const Spring = 3
    
    const Apples = 0
    const Oranges = 1
    
    // Ideally, this should never be true!
    console.log(Summer === Apples)
  3. This is semantically incorrect - Seasons are not really integers or strings, they’re seasons!

Enums with Symbols

Symbols let us define values that are guaranteed not to collide with one another.

For example:

const Summer1 = Symbol("summer")
const Summer2 = Symbol("summer")

// Even though they have the same apparent value
// Summer1 and Summer2 don't equate
console.log(Summer1 === Summer2)
// false

console.log(Summer1)

We can define our enums using Symbols to ensure that they are not duplicated:

const Summer = Symbol("summer")
const Autumn = Symbol("autumn")
const Winter = Symbol("winter")
const Spring = Symbol("spring")

let season = Spring

switch (season) {
	case Summer:
	console.log('the season is summer')
	break;
	case Winter:
	console.log('the season is winter')
	break;
	case Spring:
	console.log('the season is spring')
	break;
	case Autumn:
	console.log('the season is autumn')
	break;
	default:
		console.log('season not defined')
}

Using Symbols ensures that the only way we can assign an enum value is by using the constants that we defined initially.

Enums with Classes

To make our code more semantically correct, we can create a class to hold groups of enums.

For example, our seasons should have a way for us to identify that they all belong to a similar classification.

Let’s see how we can use classes and objects to create distinct enum groups:

// Season enums can be grouped as static members of a class
class Season {
  // Create new instances of the same class as static attributes
  static Summer = new Season("summer")
  static Autumn = new Season("autumn")
  static Winter = new Season("winter")
  static Spring = new Season("spring")

  constructor(name) {
    this.name = name
  }
}

// Now we can access enums using namespaced assignments
// this makes it semantically clear that "Summer" is a "Season"
let season = Season.Summer

// We can verify whether a particular variable is a Season enum
console.log(season instanceof Season)
// true
console.log(Symbol('something') instanceof Season)
//false

// We can explicitly check the type based on each enums class
console.log(season.constructor.name)
// 'Season'

Listing All Possible Enum Values

If we used the class-based approach above, we can loop through the keys of the Season class to obtain all the enum values under the same group:

Object.keys(Season).forEach(season => console.log("season:", season))
// season: Summer
// season: Autumn
// season: Winter
// season: Spring

When to Use Enums in Javascript?

In general, enums are helpful if there are a definite number of fixed values for any one variable_

For example, the crypto standard library for Node.js has a list of supported algorithms, that can be considered an enum group.

Using enums in Javascript correctly will lead to better code that is more stable, easier to read and less error prone.


Like what I write? Join my mailing list, and I'll let you know whenever I write another post. No spam, I promise!

Comments

Soham Kamani

Written by Soham Kamani, an author,and a full-stack developer who has extensive experience in the JavaScript ecosystem, and building large scale applications in Go. He is an open source enthusiast and an avid blogger. You should follow him on Twitter