Naming convention for const object keys in ES6

JavascriptEcmascript 6Naming Conventions

Javascript Problem Overview


Is there a recommended naming convention for key names within a const object in es6? I haven't been able to find a resource which states if they should be uppercase or lowercase.

const COLOR_CODES = {
  BLUE: 1,
  RED: 1
};

vs

const COLOR_CODES = {
  blue: 1,
  red: 1
};

The examples from this MDN article show both styles, so maybe both are acceptable.

Javascript Solutions


Solution 1 - Javascript

NOTE: be aware that the accepted response has a link to an obsolete Google style guide

This is nice (string literals or integer literals):

const PI = 3.14;
const ADDRESS = '10.0.0.1';

but...

const myObject = { key: 'value' };
const userSuppliedNumber = getInputNumber()

Google JavaScript Style Guide says:

> Declare all local variables with either const or let. Use const by > default, unless a variable needs to be reassigned. The var keyword > must not be used. > > Every constant is a @const static property or a module-local const > declaration, but not all @const static properties and module-local > consts are constants. Before choosing constant case, consider whether > the field really feels like a deeply immutable constant. For example, > if any of that instance's observable state can change, it is almost > certainly not a constant. Merely intending to never mutate the object > is generally not enough.

JavaScript.info says:

> ...capital-named constants are only used as aliases for “hard-coded” > values.

Solution 2 - Javascript

According to Google it would be all caps. Speaking from experience, most of the other programming languages have all caps so I would suggest using that.

Use NAMES_LIKE_THIS for constant values.

Use @const to indicate a constant (non-overwritable) pointer (a variable or property).

Google javascript guide https://google.github.io/styleguide/javascriptguide.xml

Solution 3 - Javascript

Naming conventions are all over the place, I personally still haven't decided on my preference but to add to the discussion this is what Airbnb JavaScript Style Guide says (see the last examples):

// bad
const PRIVATE_VARIABLE = 'should not be unnecessarily uppercased within a file';

// bad
export const THING_TO_BE_CHANGED = 'should obviously not be uppercased';

// bad
export let REASSIGNABLE_VARIABLE = 'do not use let with uppercase variables';

// ---

// allowed but does not supply semantic value
export const apiKey = 'SOMEKEY';

// better in most cases
export const API_KEY = 'SOMEKEY';

// ---

// bad - unnecessarily uppercases key while adding no semantic value
export const MAPPING = {
  KEY: 'value'
};

// good
export const MAPPING = {
  key: 'value'
};

Solution 4 - Javascript

Google once recommended the following:

const COLOR_CODES = {
  BLUE: 1,
  RED: 1
};

See: https://google.github.io/styleguide/javascriptguide.xml#Constants

  • Use NAMES_LIKE_THIS for constant values.
  • Use @const to indicate a constant (non-overwritable) pointer (a variable or property).
  • Never use the const keyword as it's not supported in Internet Explorer.

However, the updated style guidelines have different recommendations.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionmralexlauView Question on Stackoverflow
Solution 1 - JavascriptSandroMarquesView Answer on Stackoverflow
Solution 2 - JavascriptMurfView Answer on Stackoverflow
Solution 3 - JavascriptDaniel SokolowskiView Answer on Stackoverflow
Solution 4 - JavascriptDan WilsonView Answer on Stackoverflow