README

Airbnb JavaScript Style Guide() {

A mostly reasonable approach to JavaScript

 Note: this guide assumes you are using Babel, and requires that you use babel-preset-airbnb or the equivalent. It also assumes you are installing shims/polyfills in your app, with airbnb-browser-shims or the equivalent.





This guide is available in other languages too. See Translation

Other Style Guides

  - ES5 (Deprecated)
  - React
  - CSS-in-JavaScript
  - CSS & Sass
  - Ruby

 Table of Contents

  1. Types
  1. References
  1. Objects
  1. Arrays
  1. Destructuring
  1. Strings
  1. Functions
  1. Arrow Functions
  1. Classes & Constructors
  1. Modules
  1. Iterators and Generators
  1. Properties
  1. Variables
  1. Hoisting
  1. Comparison Operators & Equality
  1. Blocks
  1. Control Statements
  1. Comments
  1. Whitespace
  1. Commas
  1. Semicolons
  1. Type Casting & Coercion
  1. Naming Conventions
  1. Accessors
  1. Events
  1. jQuery
  1. ECMAScript 5 Compatibility
  1. ECMAScript 6+ (ES 2015+) Styles
  1. Standard Library
  1. Testing
  1. Performance
  1. Resources
  1. In the Wild
  1. Translation
  1. The JavaScript Style Guide Guide
  1. Chat With Us About JavaScript
  1. Contributors
  1. License
  1. Amendments

 Types

  
  - 1.1 Primitives: When you access a primitive type you work directly on its value.

    - string
    - number
    - boolean
    - null
    - undefined
    - symbol
    - bigint

    

    javascript
    const foo = 1;
    let bar = foo;

    bar = 9;

    console.log(foo, bar); // = 1, 9
    

    - Symbols and BigInts cannot be faithfully polyfilled, so they should not be used when targeting browsers/environments that don’t support them natively.

  
  - 1.2  Complex: When you access a complex type you work on a reference to its value.

    - object
    - array
    - function

    

    javascript
    const foo = [1, 2];
    const bar = foo;

    bar[0] = 9;

    console.log(foo[0], bar[0]); // = 9, 9
    

⬆ back to top

 References

  
  - 2.1 Use const for all of your references; avoid using var. eslint: prefer-const, no-const-assign

     Why? This ensures that you can’t reassign your references, which can lead to bugs and difficult to comprehend code.

    javascript
    // bad
    var a = 1;
    var b = 2;

    // good
    const a = 1;
    const b = 2;
    

  
  - 2.2 If you must reassign references, use let instead of var. eslint: no-var

     Why? let is block-scoped rather than function-scoped like var.

    javascript
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }

    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    

  
  - 2.3 Note that both let and const are block-scoped, whereas var is function-scoped.

    javascript
    // const and let only exist in the blocks they are defined in.
    {
      let a = 1;
      const b = 1;
      var c = 1;
    }
    console.log(a); // ReferenceError
    console.log(b); // ReferenceError
    console.log(c); // 

Top issues