Programmers have used JavaScript as a creative outlet since the dawn of the web. The bare-bones nature of JavaScript allows for expressive code, and with expressive code comes interesting ways to write it. Much like fashion, various styles of have come and gone over the years: some good, some bad, and some unforgettable.

Learning the strengths and weaknesses of each of these styles gives us a closer look into where JavaScript has come from, where it is headed, and how we can be ready for it.

Below I’ve listed a few styles that define key points in JavaScript’s history.

Comma first

Some called it the “wild west.” A ragtag group of hackers set out on changing the world, bringing server-side JavaScript to the masses. An entire ecosystem was to be born, a civilization to be built — from scratch. There were no rules here, only commas. Lots and lots of commas.

So many commas in fact that people would misplace them. Issues like these:

var a = 5,

b = 6,

c = 7

d = 8,

e = 9;

were commonplace. How do we manage all these commas? We put them in plain sight: at the beginning of the line — making missing ones much easier to spot.

var a = 5

, b = 6

c = 7

, d = 8

, e = 9;

This style is still prevalent in many codebases, but others have ditched the convention, citing that “YUI compressor will fix it anyway.”

No-indent

Inspired by poorly-formatted PHP questions on WebmasterWorld, the “no-indent” style placed each line of code at the first column of the screen. Every line was just as important as the previous one — no favoritism or gross callback nesting here. Coders could focus on more important things, as worrying about 80-character line limits became a thing of the past.

db.get(‘user-1234-password’, function (err, value) {

if (err) {

throw err;

} else {

md5.secure(value, function (err, safePassword) {

if (err) {

throw err;

} else {

db.put(‘user-1234-password’, safePass, function (err, value) {

res.send(‘looks good’);

});

}

});

}

});

Callback hell was successfully defeated, but many claimed the new style made code look like handguns and it subsequently faded into obscurity.

Spreadsheet

As an attempt to attract more “business types” to JavaScript, a select few put forward a new coding style to reflect the tools those individual were comfortable working with. Playing off of the traditional “ASCII-art indentation” style seen here:

// Assignment operators are aligned for a v8 performance boost

var counterIndex = 0;

var result = db.get(‘key’).on(‘data’, console.log);

var itemList = [‘apples’, ‘bananas’, ‘oranges’];

var prefix = ‘BETA-’;

The “spreadsheet” style involved tabbing code segments to form orderly columns. The result was more user-friendly, cleaner, and more consistent. Errors were no longer defined by the cryptic “line number:column” schema, but instead could be defined as a cell in a spreadsheet (“Syntax error: Line 4 column 27” v.s. the much cleaner “Syntax Error: C6”).

This style was abandoned when Office 2007 came out and no one could find the WordArt menu.