Best way to align/indent code for a multiline JS object?

Question

Is there a 'best way' or 'standard way' to align JS objects?

Here are some different examples:

Align keys

        var boundBox = {x: click.x - boundBoxDefaultSize/2,
                        y: click.y - boundBoxDefaultSize/2,
                        width: boundBoxDefaultSize,
                        height: boundBoxDefaultSize }

Align colons

        var boundBox = {x: click.x - boundBoxDefaultSize/2,
                        y: click.y - boundBoxDefaultSize/2,
                    width: boundBoxDefaultSize,
                   height: boundBoxDefaultSize }

One line

        var boundBox = {x: click.x - boundBoxDefaultSize/2, y: click.y - boundBoxDefaultSize/2, width: boundBoxDefaultSize, height: boundBoxDefaultSize }

Answer 1

I highly recommend you this Style guide https://github.com/airbnb/javascript

So, your code should be as follows:

var boundBox = {
  x: click.x - boundBoxDefaultSize/2,
  y: click.y - boundBoxDefaultSize/2,
  width: boundBoxDefaultSize,
  height: boundBoxDefaultSize
};