// Use whitespace to promote readability

if ( condition ) {
    // statements
}

while ( condition ) {
    // statements
}

var i;
var length = 100;

for ( i = 0; i < length; i   ) {
    // statements
}

var prop;

for ( prop in object ) {
    // statements
}

if ( true ) {
    // statements
}
else {
    // statements
}

// Variables
// Multiple `var` statements are easier to maintain
// Read more: http://benalman.com/news/2012/05/multiple-var-statements-javascript

var foo = 'bar';
var num = 1;
var undef;

// Literal notations
var array = [];
var object = {};


// var statements should always be in the beginning of their respective scope (function).
// Same goes for const and let from ECMAScript 6.

function foo() {
    var bar = '';
    var qux;

    // all statements after the variables declarations.
}

// Named function declaration
function foo( arg1, argN ) {

}

// Usage
foo( arg1, argN );

// Named function declaration
function square( number ) {
    return number * number;
}

// Usage
square( 10 );

// Really contrived continuation passing style
function square( number, callback ) {
    callback( number * number );
}

square( 10, function( square ) {
    // callback statements
});


// Function expression
var square = function( number ) {
    // Return something valuable and relevant
    return number * number;
};

// Function expression with identifier
// This preferred form has the added value of being
// able to call itself and have an identity in stack traces:
var factorial = function factorial( number ) {
    if ( number < 2 ) {
        return 1;
    }

    return number * factorial( number - 1 );
};

// Constructor declaration
function FooBar( options ) {
    this.options = options;
}

// Usage
var fooBar = new FooBar({ a: 'alpha' });

fooBar.options;
// { a: 'alpha' }

// Functions with callbacks
foo(function() {
    // Note there is no extra space between the first paren
    // of the executing function call and the word "function"
});

// Function accepting an array, no space
foo([ 'alpha', 'beta' ]);

// Function accepting an object, no space
foo({
    a: 'alpha',
    b: 'beta'
});

// Single argument string literal, no space
foo('bar');

// Inner grouping parens, no space
if ( !('foo' in obj) ) {
    // statements
}

// global variables:
typeof variable === 'undefined'

// local variables:
variable === undefined

object.prop === undefined
object.hasOwnProperty( prop )
'prop' in object

// 3.B.1.1

// `foo` has been declared with the value `0` and its type is `number`
var foo = 0;

// typeof foo;
// "number"
...

// Somewhere later in your code, you need to update `foo`
// with a new value derived from an input element

foo = document.getElementById('foo-input').value;

// If you were to test `typeof foo` now, the result would be `string`
// This means that if you had logic that tested `foo` like:

if ( foo === 1 ) {
    importantTask();
}

// `importantTask()` would never be evaluated, even though `foo` has a value of "1"


// 3.B.1.2

// You can preempt issues by using smart coercion with unary   or - operators:

foo =  document.getElementById('foo-input').value;
//    ^ unary   operator will convert its right side operand to a number

// typeof foo;
// "number"

if ( foo === 1 ) {
    importantTask();
}

// `importantTask()` will be called

// 3.B.2.1

var number = 1;
var string = '1';
var bool = false;

number;
// 1

number   '';
// "1"

string;
// "1"

 string;
// 1

 string  ;
// 1

string;
// 2

bool;
// false

 bool;
// 0

bool   '';
// "false"

// 3.B.2.2

var number = 1;
var string = '1';
var bool = true;

string === number;
// false

string === number   '';
// true

 string === number;
// true

bool === number;
// false

 bool === number;
// true

bool === string;
// false

bool === !!string;
// true

// 3.B.2.3

var array = [ 'a', 'b', 'c' ];

!!~array.indexOf('a');
// true

!!~array.indexOf('b');
// true

!!~array.indexOf('c');
// true

!!~array.indexOf('d');
// false

// Note that the above should be considered "unnecessarily clever"
// Prefer the obvious approach of comparing the returned value of
// indexOf, like:

if ( array.indexOf('a') >= 0 ) {
    // ...
}

// 3.B.2.3

var num = 2.5;

parseInt( num, 10 );

// is the same as...

~~num;

num >> 0;

num >>> 0;

// All result in 2


// Keep in mind however, that negative numbers will be treated differently...

var neg = -2.5;

parseInt( neg, 10 );

// is the same as...

~~neg;

neg >> 0;

// All result in -2
// However...

neg >>> 0;

// Will result in 4294967294

// 4.1.1
// When only evaluating that an array has length,
// instead of this:
if ( array.length > 0 ) ...

// ...evaluate truthiness, like this:
if ( array.length ) ...


// 4.1.2
// When only evaluating that an array is empty,
// instead of this:
if ( array.length === 0 ) ...

// ...evaluate truthiness, like this:
if ( !array.length ) ...


// 4.1.3
// When only evaluating that a string is not empty,
// instead of this:
if ( string !== '' ) ...

// ...evaluate truthiness, like this:
if ( string ) ...


// 4.1.4
// When only evaluating that a string _is_ empty,
// instead of this:
if ( string === '' ) ...

// ...evaluate falsy-ness, like this:
if ( !string ) ...


// 4.1.5
// When only evaluating that a reference is true,
// instead of this:
if ( foo === true ) ...

// ...evaluate like you mean it, take advantage of built in capabilities:
if ( foo ) ...


// 4.1.6
// When evaluating that a reference is false,
// instead of this:
if ( foo === false ) ...

// ...use negation to coerce a true evaluation
if ( !foo ) ...

// ...Be careful, this will also match: 0, "", null, undefined, NaN
// If you _MUST_ test for a boolean false, then use
if ( foo === false ) ...


// 4.1.7
// When only evaluating a ref that might be null or undefined, but NOT false, "" or 0,
// instead of this:
if ( foo === null || foo === undefined ) ...

// ...take advantage of == type coercion, like this:
if ( foo == null ) ...

// Remember, using == will match a `null` to BOTH `null` and `undefined`
// but not `false`, '' or 0
null == undefined

// 4.2.1
// Type coercion and evaluation notes

// Prefer `===` over `==` (unless the case requires loose type evaluation)

// === does not coerce type, which means that:

'1' === 1;
// false

// == does coerce type, which means that:

'1' == 1;
// true


// 4.2.2
// Booleans, Truthies & Falsies

// Booleans:
true, false

// Truthy:
'foo', 1

// Falsy:
'', 0, null, undefined, NaN, void 0

// 5.1.1
// A Practical Module

(function( global ) {
    var Module = (function() {
        var data = 'secret';

        return {
            // This is some boolean property
            bool: true,
            // Some string value
            string: 'a string',
            // An array property
            array: [ 1, 2, 3, 4 ],
            // An object property
            object: {
                lang: 'en-us'
            },
            getData: function() {
                // get the current value of `data`
                return data;
            },
            setData: function( value ) {
                // set the value of `data` and return it
                return ( data = value );
            }
        };
    }());

    // Other things might happen here

    // expose our module to the global object
    global.Module = Module;

}( this ));

// 5.2.1
// A Practical Constructor

(function( global ) {

    function Ctor( foo ) {
        this.foo = foo;
        return this;
    }

    Ctor.prototype.getFoo = function() {
        return this.foo;
    };

    Ctor.prototype.setFoo = function( val ) {
        return ( this.foo = val );
    };

    // To call constructor's without `new`, you might do this:
    var ctor = function( foo ) {
        return new Ctor( foo );
    };

    // expose our constructor to the global object
    global.ctor = ctor;

}( this ));

// 6.1.1
// Example of code with good names

function query( selector ) {
    return document.querySelectorAll( selector );
}

var idx;
var elements = [];
var matches = query('#foo');
var length = matches.length;

for( idx = 0; idx < length; idx   ){
    elements.push( matches[ idx ] );
}

// 6.2.1
// Naming strings

`dog` is a string

// 6.2.2
// Naming arrays

`dogs` is an array of `dog` strings

// 6.2.3
// Naming functions, objects, instances, etc

camelCase; function and var declarations

// 6.2.4
// Naming constructors, prototypes, etc.

PascalCase; constructor function

// 6.2.5
// Naming regular expressions

rDesc = //;

// 6.2.6
// From the Google Closure Library Style Guide

functionNamesLikeThis;
variableNamesLikeThis;
ConstructorNamesLikeThis;
EnumNamesLikeThis;
methodNamesLikeThis;
SYMBOLIC_CONSTANTS_LIKE_THIS;

// 7.A.1.1
// A better approach than switch statements would be to use an object literal or even a module:

var switchObj = {
    alpha: function() {
        // statements
        // a return
    },
    beta: function() {
        // statements
        // a return
    },
    _default: function() {
        // statements
        // a return
    }
};

var switchModule = (function () {
    return {
        alpha: function() {
            // statements
            // a return
        },
        beta: function() {
            // statements
            // a return
        },
        _default: function() {
            // statements
            // a return
        }
    };
}());


// 7.A.2.1
// If `foo` is a property of `switchObj` or `switchModule`, execute as a method...

( Object.hasOwnProperty.call( switchObj, foo ) && switchObj[ foo ] || switchObj._default )( args );

( Object.hasOwnProperty.call( switchObj, foo ) && switchModule[ foo ] || switchModule._default )( args );

// If you know and trust the value of `foo`, you could even omit the OR check
// leaving only the execution:

switchObj[ foo ]( args );

switchModule[ foo ]( args );


// This pattern also promotes code reusability.

// 7.B.1.1
function returnEarly( foo ) {
    if ( foo ) {
        return 'foo';
    }
    return 'quux';
}