CODEWITHSUNDEEP
javascriptnaming-conventionsjshint
Benjamin Gruenbaum
Benjamin Gruenbaum

Reputation: 276306

Javascript ENUM pattern naming convention

I am working on a javascript project which requires use of javascript "Enums" meaning Objects like:

var WinnerEnum = {
    Player1: 1,
    Player2: 2,
    Draw: 0
};

This is working great for me, however, I have no idea what is the proper way (according to convention) to name the Enum because as far as I know only class names start with a capital letter (indicating the ability to call a constructor on).

JSHint also outputs the following warning:

Missing 'new' prefix when invoking a constructor.

If there is no convention, I would appreciate a good way to name enums that would not confuse them with class names. Update 2014 : JSHint no longer does this.

Upvotes: 63

Views: 86299

Answers (4)

JPC
JPC

Reputation: 943

Naming-wise, it depends on if you're working in TypeScript or vanilla JavaScript. Google has a JavaScript style guide but deprecated it in favour of TypeScript.

Assuming vanilla Javascript (since you're using var), the convention is to have the name in PascalCase and properties in ALL_CAPS. This is likely inherited from Java conventions and is perhaps clearer when you use the following pattern for creating immutable enums:

class WinnerEnum {
    static get PLAYER_1() { return 1 }
    static get PLAYER_2() { return 2 }
    static get DRAW() { return 0 }
}

Class names are PascalCase by convention and a common pattern for const primitive variables is to use all uppercase. As a live authoritative example, this pattern is used in the Chrome extension runtime API's ContextType enum.

For TypeScript, you should follow the official TypeScript guide for enums which uses the same case rules as you're already following. This is likely based on C# conventions (both are MS) where essentially everything but local variables is PascalCase. The only difference is that you would be declaring it with the enum keyword rather than initializing a var. The values are also optional. You could for example do this where the values are auto-incremented from 0:

enum WinnerEnum {
    Draw,
    Player1,
    Player2,
}

Upvotes: 0

Ricardo
Ricardo

Reputation: 4308

First, there is no "correct" way* of declaring a pseudo-enum in JS. You should strive to be consistent within your existing code base and/or your organization's conventions if possible.

One popular convention is Google JavaScript Style Guide. E.g.:

const TemperatureScale = {
  CELSIUS: 'celsius',
  FAHRENHEIT: 'fahrenheit',
};

Curiously, this is inconsistent with MDN's hidden convention for const, as in Google's example, TemperatureScale is a const and TemperatureScale.CELSIUS is not!

* it must be a valid JavaScript identifier.

Upvotes: 2

dharcourt
dharcourt

Reputation: 963

That is indeed the correct way to name the enum, but the enum values should be ALL_CAPS instead of UpperCamelCase, like this:

var WinnerEnum = {
    PLAYER_1: 1,
    PLAYER_2: 2,
    DRAW: 0
};

This is similar to Java's naming convention for enums.

Some references:

As with coding style in general, you'll find people doing things in many different ways, with each way having its own set of good reason. To make things easiest for anyone reading and working with your code, however, I would recommend using the style which has the most authoritative reference and therefore usually the most widespread adoption.

I couldn't find any reference more authoritative than Google's style guide and the writings above, written by people who have given some serious thought to enums, but I'd be interested to hear of any better references.

Upvotes: 61

Benjamin Gruenbaum
Benjamin Gruenbaum

Reputation: 276306

According to Google's coding conventions this is the correct way indeed to name an enum in javascript.

As requested here is a link.

Upvotes: 13

Related Questions