My JavaScript Guidelines

gistfile1.md

JavaScript

Semicolon

I use it. If you don't, read these:

• http://brendaneich.com/2012/04/the-infernal-semicolon/
• twbs/bootstrap#3057

You can still ignore semicolons, but know that ASI is a syntactic error correction procedure, according to Brendan Eich himself.

Whitespaces

• Never mix tabs or spaces.
• Prefer spaces over hard tabs for indentation (I recommend 2 spaces).
• Eliminate end of line whitespace.
• Eliminate blank line whitespace.
• Too much space and no space at all are equally bad.

Naming

• Use camelCase for variables.
• Contructor functions must start with capital letter like ModalWindow.
• Avoid names like handler, data, or other generic words.
• Don't even think about using Hungarian notation.

Quotes

Choose between single or double quotes, but don't mix different quote types in the same project.

Parens, Braces, Linebreaks

// Add whitespace around parens and braces,
// but not around arguments.
if (something) {
  doSomething();
}

if (something) {
  doSomething();
} else {
  doSomethingElse();
}

// Again, no spaces around arguments.
while (condition) {
  doSomething();
}

// The whitespace balance.
for (var i = 0; i < 100; i++) {
  doSomething();
}

Assignments, Declarations, Functions

// Variables
var name = "John Doe"
  , email = "john@example.org"
  , status
;

// Literal notation
var array = []
  , object = {}
;

// Object attributes
var object = {
    name: "John Doe"
  , email: "john@example.org"
  , status: null
};

// Named and assigned functions
function hello() {
  doSomething();
}

var hello = function() {
  doSomething();
};

// Argument declaration
function hello(message, name, callback) {
  doSomething();
}

// Executing functions
// -------------------
//
// Callbacks must ignore spaces around parens and braces
hello("Hi there", "John Doe", function(){
  doSomethingElse();
});

Comparison

Use === and !== wherever is possible.

General

Short-circuit functions increase readability

function something(arg) {
  var result;

  if (!arg) {
    return;
  }

  result = doSomething();
  result = doSomethingElse(result);

  return result;
}

Boolean return

Don't use ifs to return a boolean. So instead of doing

function greater(a, b) {
  if (a > b) {
    return true;
  } else {
    return false;
  }
}

return the expression itself.

function greater(a, b) {
  return a > b;
}

I always avoid spaces around parens and braces... I don't like that! :-(

Really useful!

Nice! In addition to that, I avoid making use of inline conditions most of the time.

Do you have a common practice to create namespaces?
And do you keep your code inside any kind of scope like (function(){/* code */})(); just externalizing what you want by setting it into window/etc?

@gregoriokusowski I do use namespaces for everything and modules for scoping, but I don't expose external APIs that much. Most of my recent JavaScript is self-contained.

In here:

// Callbacks must ignore spaces around parens and braces
hello("Hi there", "John Doe", function(){
  doSomethingElse();
});

Any specific reason you chose NOT to insert a whitespace between the closing parens and the opening curly brace?

Also, whenever I get conditions with nested parens and that kind of stuff, I tend to break it down into smaller peaces and assign them to some variables. In worst cases I just break them down into a multi-line & indented condition statement.

@eshiota I like to think of this as a different kind of function, for callbacks only. Can't really justify that. :P

@fnando can you add about the use of namespace and modules?

I think this way is better :)

var object = {
  name: "John Doe",
  email: "john@example.org",
  status: null
};

// Callbacks must ignore spaces around parens and braces
For me it is the same to do that: if (true){ }, I prefer the space.

And use comma before the variable is good when you delete the line to have a right sintaxe, but I think it is bad to keep.
I like to align the equals symbols to be clearer to read in this case too.

I saw in your project you removed the spaces from the edges of a block like this: {a: a, b: b}, why not to use space?

Usefull tip's ... I'll use it