Why does the JavaScript need to start with ";"?

Question

I have recently noticed that a lot of JavaScript files on the Web start with a ; immediately following the comment section.

For example, this jQuery plugin's code starts with:

/**
 * jQuery.ScrollTo
 * Copyright (c) 2007-2008 Ariel Flesler - aflesler(at)gmail(dot)com | http://flesler.blogspot.com
 * Dual licensed under MIT and GPL.
 * Date: 9/11/2008                                      
 .... skipping several lines for brevity...
 *
 * @desc Scroll on both axes, to different values
 * @example $('div').scrollTo( { top: 300, left:'+=200' }, { axis:'xy', offset:-20 } );
 */
;(function( $ ){

Why does the file need to start with a ;? I see this convention in server-side JavaScript files as well.

What are the advantages and disadvantages of doing this?

score 352 · Accepted Answer · edited May 09 '14 at 20:41

352

I would say since scripts are often concatenated and minified/compressed/sent together there's a chance the last guy had something like:

return {
   'var':'value'
}

at the end of the last script without a ; on the end. If you have a ; at the start on yours, it's safe, example:

return {
   'var':'value'
}
;(function( $ ){ //Safe (still, screw you, last guy!)

return {
   'var':'value'
}
(function( $ ){ //Oh crap, closure open, kaboom!

return {
   'var':'value'
};
;(function( $ ){ //Extra ;, still safe, no harm

edited May 09 '14 at 20:41

SQLMason

3,275
1
30
40

answered Mar 20 '10 at 01:39

Nick Craver

623,446
136
1,297
1,155

8

You can't actually have a `return` statement as the last thing in a script, can you? Returning at top level doesn't make sense. It'd have to be something else, right? – user2357112 May 13 '14 at 20:46
3

@user2357112 Even more so, code *after* a `return` statement doesn't get executed, so it doesn't make sense to concatenate. At least there is a `}` missing. – Robert Jul 07 '14 at 06:31

score 57 · Answer 2 · answered Mar 20 '10 at 01:39

57

I believe (though I am not certain, so please don't pounce on me) that this would ensure any prior statement from a different file is closed. In the worst case, this would be an empty statement, but in the best case it could avoid trying to track down an error in this file when the unfinished statement actually came from above.

answered Mar 20 '10 at 01:39

Jerry Bullard

6,116
18
27

9

I am not 100% sure but I am with you on this one, Jerry. – o.k.w Mar 20 '10 at 01:40

score 13 · Answer 3 · answered Jun 04 '13 at 14:33

Consider this example:

function a() {
  /* this is my function a */
}
a()
(function() {
  /* This is my closure */
})()

What will happen is that it will be evaluated like this:

function a() {
  /* this is my function a */
}
a()(function() {})()

So what ever a is returning will be treated as a function an tried to be initialized.

This is mostly to prevent errors when trying to concat multiply files into one file:

a.js

function a() {
  /* this is my function a */
}
a()

b.js

(function() {
  /* This is my closure */
})()

If we concat these files together it will cause problems.

So therefore remember to put your ; in front of ( and maybe also a few other places. Btw. var a = 1;;;var b = 2;;;;;;;;;var c = a+b; is perfectly valid JavaScript

Why does the JavaScript need to start with ";"?

3 Answers3

Linked

Related