Towers Watson Exchange Solutions JavaScript Style Guide

We are extending the Airbnb Style Guide, with overrides for things we do not plan to prescribe to.

Table of Contents

1. Usage
2. With React Style
3. Without React Style
4. Es5
5. Rules
6. Commas

Usage

With React Style

1. npm install --save-dev eslint-config-exchange-solutions babel-eslint eslint-plugin-react
2. add "extends": "exchange-solutions" to your .eslintrc

Without React Style

1. npm install --save-dev eslint-config-exchange-solutions babel-eslint
2. add "extends": "exchange-solutions/base" to your .eslintrc

ES5 - Rule Documenation

1. npm install --save-dev eslint-config-exchange-solutions
2. add "extends": "exchange-solutions/es5" to your .eslintrc

See Airbnb's Javascript styleguide, Towers Watson Exchange Solutions styleguide and the ESlint config docs for more information.

Rules

Commas

• 1 Additional trailing comma: Nope.

Airbnb [states] that this rule makes git diffs cleaner, though we don't really see any significant value in this especially for Arrays or Objects that only have one item.

// bad const hero = { firstName: 'Dana', lastName: 'Scully', };

const heroes = [ 'Batman', 'Superman', ];

// good const hero = { firstName: 'Dana', lastName: 'Scully' };

const heroes = [ 'Batman', 'Superman' ];

⬆ back to top

Curly braces around objects

• 1 Either both curly braces or neither should directly enclose newlines. -- See the eslint docs for object-curly-newline { "consistent": true };

⬆ back to top

Unary increments and decrements

• 1 You can use ++ for loops, but otherwise use += 1 or -= 1 syntax.

The Airbnb example suggests that array methods such as filter and reduce should be used over traditional loops. We agree that those options are often better. However, we find value, in cases where loops are necessary, to be allowed the convenience of unary increment statements for the loop declaration. Otherwise, we agree with their reasoning about unary increment and decrement statements.

// bad

const array = [1, 2, 3];
let num = 1;
num++;
--num;


// good

const array = [1, 2, 3];
let num = 1;
num += 1;
num -= 1;

for (let i = 0; i < array.length; i++) {
  console.log(`The value at ${i} is ${array[i]}`);
}

⬆ back to top