JavaScript semicolon-less code style and minification?

Question

I am trying to decide if it worth to go with JavaScript semicolon-less style.

If I have JavaScript code without semicolon:

function(){
    var first = 1
    var second = 2
    sum = 1 + 2
    return sum
}

it will work in browser and Node.js.

But will minified (by Uglify or Closure Compiler) code work in browser and Node.js?

I've read the article Semicolons in JavaScript are optional. it says that it should work.

The minification should add semicolons where needed, if just to replace the linebreaks. — Bergi, Aug 22 '12 at 13:15
@Pointy, +1, get off his `;` key! (because pointy things are often sharp) — CaffGeek, Aug 22 '12 at 13:17
Using no semicolons in a language that has pretty much the syntax of every single curly-braces-and-semicolons language does *not* make the code look cleaner! While I hate the CoffeeScript syntax it *might* be something worth a look for you... — ThiefMaster, Aug 22 '12 at 13:19
Here is an interesting thread on the subject (including crockford getting upset): https://github.com/twitter/bootstrap/issues/3057 — David Hellsing, Aug 22 '12 at 13:24
I'm with @ThiefMaster: dislike coffeescript syntax. The only people I can imagine thinking the code looks cleaner without semicolons are BASIC and COBOL developers (with a name like `WHITECOLOR`, I wouldn't be at all surprised if I'm right about your background ;p) — Elias Van Ootegem, Aug 22 '12 at 13:24
I'm going to ask ECMA to make the `;` a requirement at the end of each statement, as it should have been from day one — Elias Van Ootegem, Aug 22 '12 at 13:32
@WHITECOLOR: at first, very likely. But that might show some people how important the language is, and may encourage some people to learn a bit more about the most misunderstood language — Elias Van Ootegem, Aug 22 '12 at 19:30
There is nothing wrong with not using semicolons. I would prefer ECMA not make it a requirement. (Which they haven't since this post) — Michael Ramos, Jan 26 '16 at 16:48

score 25 · Accepted Answer · edited May 23 '17 at 12:10

I'm personally a pro-semicolon sort of guy, but there is a compelling argument for the alternative, which is frequently not given a fair voice. As with all coding style arguments this will be a never-ending debate with no reasonable conclusion. Do what you and your team feel more comfortable with.

If you do go for a frugal semicolon approach, make sure you and your team properly understand the automatic semicolon insertion (ASI) and statement termination rules. That is definitely a good thing to understand whatever your decision.

With respect to minification: If you don't want to risk the potential headache of a minifier bug and the associated burden of reporting it and fixing it (or waiting for a fix) because it's not doing ASI properly, then don't rely on ASI.

Isaacs (Node.js maintainer, and therefore minification agnostic for the purposes of this question) on the subject
He recommends this excellent impartial analysis of the ASI rules

score 5 · Answer 2 · edited Oct 08 '20 at 20:42

Despite that semicolons in JavaScript are optional, there's strong advice against not using semicolons:

It makes your code vulnerable for bugs ~~resulting from removing whitespace (used in minification):~~ Try this:

var a = 1; var b = 7; var sum = a+b (a + b)

~~it minifies to var a=1,b=7,sum=a+b(a+b);,~~ which will result in the error number is not a function. There are also other cases and this case.

Update: This bug wasn't resulting from minification, however, the next one is:

It makes your code vulnerable for bugs resulting from minification: Try:

  var isTrue = true

  function doSomething() { return 'yeah' }

  function doSomethingElse() { return 'yes, dear' }

  doSomething()

  !isTrue && doSomethingElse()

minifies to:

  var isTrue=true;function doSomething(){return "yeah"}function doSomethingElse(){return "yes, dear"}doSomething()!isTrue&&doSomethingElse();

which results in:

  SyntaxError: Unexpected token !

It makes your code less readable and maintainable in terms of convenience: Using the semicolon has been rightfully established as good practice, and a trained JavaScript developer will be puzzled by code trying to evade the convention.

Another thing is, you have to ask yourself: What do you really gain omitting the semicolon?

Clean Code? If you want JavaScript to not look like JavaScript, try CoffeeScript. But there are some misguided notions, which believe that pitfalls like the one mentioned above are cleared by «Easy solution: when a line starts with parenthesis, prepend a semicolon to it.». How is this clean code, and how does that help anyone reading your code?

Bottom Line: With minification, I would definitely try to use conventions of JSLint. I've seen some people finally linting their JavaScript code after hours of trying to fix a bug not happening in unminified, but in minified code. Don't put yourself into this misery; semicolons may be ugly at first sight, but they keep the bugs out.

`var a = 1; var b = 7; var sum = a+b (a + b)` is already invalid, how should this prove your point? — Felix Kling, Aug 22 '12 at 17:23
@FelixKling True, I got lost there. Corrected it and included an argument proving my point. — Beat Richartz, Aug 23 '12 at 08:24
If your minifier doesn't add semicolons before minification, I think it sucks. I puke when I see code with semicolons. The code gets so much easier to read without them. In any case I would write the code finnished without semicolons, and then add them before minification. — agiopnl, Jan 05 '22 at 17:06

score 3 · Answer 3 · answered Aug 22 '12 at 13:18

3

The compilers and minifiers are probably intelligent enough to add the semicolons if needed (and if it helps the minifying process).

However! A semicolon tells the interpreter that this is the end of a statement. If it is missing, it has to look at the beginning of the next line to find out if it makes sense for the statement to continue. Then it will decide, if the next line is a new statement (i.e. a semicolon was missing) or if it's in fact the continuation of the statement from the previous line.

Without semicolons, you're slowing things down! Not to mention that this could introduce some obscure errors when the interpreter, executing the algorithm I described, decides wrong!

answered Aug 22 '12 at 13:18

Imp

8,409
1
25
36

1

It seems that the only ambiguous situation is when next statement tarts with brace "(". – WHITECOLOR Aug 22 '12 at 13:23
@WHITECOLOR The interpreter still has to look at the next line to decide that. It's worth benchamrking maybe, but doing so for every line will slow things down. – Imp Aug 22 '12 at 13:28
The code is compiled before run anyway, I don't think it makes any difference. A benchmark would be cool tho. However I for sure can tell the extra load on my brain seeing all the semicolons. – agiopnl Jan 05 '22 at 17:15

score 0 · Answer 4 · edited Oct 08 '20 at 20:39

0

Don't do it. Semicolon insertion is a very dangerous thing. The size gain is not worth the added risk.

Douglas Crockford will not like you if you do it :) JavaScript: The Good Parts

edited Oct 08 '20 at 20:39

Peter Mortensen

30,738
21
105
131

answered Aug 22 '12 at 13:14

Per Salbark

3,597
1
23
24

3

I've read this http://mislav.uniqpath.com/2010/05/semicolons/ – WHITECOLOR Aug 22 '12 at 13:19
8

:-D From what I've heard, Douglas Crockford will never like you ;) (If you don't code exactly as him) – Imp Aug 22 '12 at 13:20
2

@WHITECOLOR: While everything in that article is true, I would still advice against it. Every peice of example code you read will have semi-colons, so there's that. And also problems related to auto-inserted semi-colons can be tricky to debug. – Per Salbark Aug 22 '12 at 13:32
3

This answer has absolutely no reasoning for its answer: -1 . Please give reasons for your opinion and justify your conclusion – B T Jul 15 '13 at 05:47
semi-colons is a good thing you must not forget when you are a programmer.Except some programming languages, they don't use that, I advise you should use semi-colons to help your code clear. – dalmate Apr 21 '18 at 04:43

score -2 · Answer 5 · edited Jul 24 '16 at 11:47

-2

IMHO, do not do that. You don't really gain that much and semicolon is AFAIK placed there automatically, and it can be put in a place where it will produce weird bugs.

edited Jul 24 '16 at 11:47

Peter Mortensen

30,738
21
105
131

answered Aug 22 '12 at 13:15

Peter

240
1
4
12

JavaScript semicolon-less code style and minification?

5 Answers5

Linked

Related