Created
April 6, 2010 19:24
-
Star
(259)
You must be signed in to star a gist -
Fork
(34)
You must be signed in to fork a gist
-
-
Save isaacs/357981 to your computer and use it in GitHub Desktop.
A better coding convention for lists and object literals in JavaScript
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// See comments below. | |
// This code sample and justification brought to you by | |
// Isaac Z. Schlueter, aka isaacs | |
// standard style | |
var a = "ape", | |
b = "bat", | |
c = "cat", | |
d = "dog", | |
e = "elf", | |
f = "fly", | |
g = "gnu", | |
h = "hat", | |
i = "ibu"; | |
// comma-first style | |
var a = "ape" | |
, b = "bat" | |
, c = "cat" | |
, d = "dog" | |
, e = "elf" | |
, f = "fly" | |
, g = "gnu" | |
, h = "hat" | |
, i = "ibu" | |
; | |
// error in standard style | |
var a = "ape", | |
b = "bat", | |
c = "cat", | |
d = "dog" | |
e = "elf", | |
f = "fly", | |
g = "gnu", | |
h = "hat", | |
i = "ibu"; | |
// error in comma-first style | |
var a = "ape" | |
, b = "bat" | |
, c = "cat" | |
, d = "dog" | |
e = "elf" | |
, f = "fly" | |
, g = "gnu" | |
, h = "hat" | |
, i = "ibu" | |
; | |
// Objects: | |
// JSON.stringify style | |
var o = { | |
a : "ape", | |
b : "bat", | |
c : "cat", | |
d : "dog", | |
e : "elf", | |
f : "fly", | |
g : "gnu", | |
h : "hat", | |
i : "ibu" | |
}, | |
a = [ | |
[ "ape", "bat" ], | |
[ "cat", "dog" ], | |
[ "elf", "fly" ], | |
[ "gnu", "hat" ], | |
[ "ibu" ] | |
]; | |
// comma-first | |
var o = | |
{ a : "ape" | |
, b : "bat" | |
, c : "cat" | |
, d : "dog" | |
, e : "elf" | |
, f : "fly" | |
, g : "gnu" | |
, h : "hat" | |
, i : "ibu" | |
} | |
, a = | |
[ [ "ape", "bat" ] | |
, [ "cat", "dog" ] | |
, [ "elf", "fly" ] | |
, [ "gnu", "hat" ] | |
, [ "ibu" ] | |
]; | |
// errors in objects: | |
// JSON.stringify style | |
var o = { | |
a : "ape", | |
b : "bat", | |
c : "cat", | |
d : "dog" | |
e : "elf", | |
f : "fly", | |
g : "gnu", | |
h : "hat", | |
i : "ibu" | |
}, | |
a = [ | |
[ "ape", "bat" ], | |
[ "cat", "dog" ], | |
[ "elf", "fly" ] | |
[ "gnu", "hat" ], | |
[ "ibu" ] | |
]; | |
// comma-first | |
var o = | |
{ a : "ape" | |
, b : "bat" | |
, c : "cat" | |
, d : "dog" | |
e : "elf" | |
, f : "fly" | |
, g : "gnu" | |
, h : "hat" | |
, i : "ibu" | |
} | |
, a = | |
[ [ "ape", "bat" ] | |
, [ "cat", "dog" ] | |
, [ "elf", "fly" ] | |
[ "gnu", "hat" ] | |
, [ "ibu" ] | |
]; | |
// Addendum: effects on the return statement. | |
// It does not break. | |
return [ 1 | |
, 2 | |
, 3 | |
] // returns [1,2,3] | |
return { a : "ape" | |
, b : "bat" | |
} // returns {a:"ape",b:"bat"} | |
// even just separating two values by commas is fine, | |
// though a bit silly | |
return 1 | |
, 2 | |
, 3 | |
, 4 // returns the last value, 4 | |
// this, however is wrong: | |
return | |
1 | |
, 2 // returns undefined, because of semicolon-insertion. | |
// so is this. otb == fail. | |
return | |
{ a : "ape" | |
, b : "bat" | |
} // returns undefined, | |
// then creates a block with two named statements. | |
// this is ok: | |
return ( 1 | |
, 2 | |
) // returns 2 | |
// so is this: | |
return ( | |
{ a : "ape" | |
, b : "bat" | |
} | |
) // returns {a:"ape",b:"bat"} | |
// Addendum 2: A function call | |
doSomething( aPrettyLongVariableName | |
, "A string, which has some useful information" | |
, "If you put these all together, it'd be too long" | |
, { a: "is for antelope", b: "is for bat" } | |
, 42 | |
) | |
// Addendum 3: More realistic error in standard style: | |
// leaks FIVE globals! | |
var a = "ape eat banana", | |
b = "bat, allowed to fly", | |
c = "cat toy", | |
d = "dog chasing the mailman," | |
e = "elf lord", | |
f = "fly through the air", | |
g = "gnu is not unix", | |
h = "hat goes on your head", | |
i = "ibu isn't a cow"; | |
// Error: Can't call method 'forEach' of undefined. | |
// not passing in undefined as an argument!?? | |
mergeLists([ apple, [ penelope, granger ] ], | |
[ fun ], | |
[ 1, 2, 3, 4, 5, 6, 7, 8 ] | |
[ "mary's store has many pies, and cookies, and eggs," ] | |
[ function() { doSomething() } ]); |
@KoJaMan did you create any special tooling to make things behave better? eg. custom plugins for eslint, etc. Would love to transition some code bases but docblocks not working as intended is a blocker for me sadly.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
@hcdct and/or
awk
👍