JavaScript Style Guide

1. Use JSHint

See installing GruntJS on the main readme. There is a grunt task for jshint, simply run: grunt jshint from the command line.

2. Spacing

• Indent using 4 spaces
• No end of line whitespace
• Use a blank line with no whitespace after blocks
• Use a space after if/else/for/while/try
• Use a space after variable declaration and assignment

Good

    var x = 10;

    if (something) {
    } else {
    }

    for (x = 0; x < 10; x++) {
    }

    while (true) {
    }

    try {
    } catch (e) {
    }

    // No space after function keyword
    function(x) {
    }

Bad

    var x=10; // Use spacing

    // No space after the if or after the paren
    if(something){
    }

// No indent
if (true) {
}

    // Use curly braces
    if (true)
        callSomething();

    // Use multiple lines
    if (true) { callSomething();}

    if (someting) {
    }
    doSomethingAfter(); // Put a blank line after the previous block

3. Curly Brackets

• Always use curly brackets
• The starting bracket should go on the same line as the keyword
• The ending bracket should be on a new line by itself

Good

    if (something) {
    } else {
    }

    for (x = 0; x < 10; x++) {
    }

    while (true) {
    }

    try {
    } catch (e) {
    }

Bad

    // Always use curly braces
    if (true)
        callSomething();

    // Use multiple lines
    if (true) { callSomething();}

4. Function Calls

• No spaces for parens when calling a function
• Only use a space after the comma for multiple arguments

Good

noArgsCall();
callSomething(arg);
callSomething2(arg1, arg2);

Bad

noArgsCall ( );
callSomething ( arg );
callSomething2 ( arg1 , arg2 );

5. Assignment

• Use one var at the top of the function
• Use a newline after the semicolon

Good

    var x, y, z;

    function something(x) {
        var x, y,
            z = true;

        // Code
    }

    function somethingToo(x) {
        var x = 'something',
            y = 'something',
            i;

        // Code
        for (i = 0; i < 10; i++) {
        }
    }

Bad

    var x;
    var y;
    var z;

    function something(x) {
        var x;
        var y;
        var z = true;

        // Code
    }

    function somethingToo(x) {
        // var i is declared separate from the others
        for (var i = 0; i < 10; i++) {
            // All vars should be at the top of the function
            var x = 'something',
                y = 'something';
        }
    }

6. Equality

• Always use === in favor of ==

7. Quotes

• Always use a single quote, so templates can use double quotes for HTML attributes

Example

    //Template
    itemTemplate: new Simplate([
        '<span id="something">{%: $.AccountName %}</span>'
    ])

8. Comments

• Put comment above line you are commenting, with some exception for inline comments
• Use JSDoc (http://usejsdoc.org/) comments when possible

Example

    // Localized
    someText: 'SalesLogix'

    /*
     * @ param {string} name Name of person
     */
    function callByName(name) {
    }

    while (/*TODO: Remove this*/ true) {
    }