What is the difference between running this code in an immediate function and not?

Question

I've seen this pattern a lot in javascript files:

(function ($) 
{
   //Perform operation X
}(jQuery));

Is there a difference between placing the above code in a js file vs the following:

function myFunc($) 
{
   //Perform operation X
}
myFunc(jQuery);

Or is it simply more terse?

I highly recommend http://www.jslint.com for learning the "standard" JS coding conventions. — John Strickler, Oct 14 '11 at 13:00
Yeah, I recently learned about it. It seems cool. The gaps in my JS knowledge are slowly filling in :) — C.J., Oct 14 '11 at 13:06
It can be quite aggravating to see JSLint rip your code apart and tell you that it's all wrong... but stick with it :) — John Strickler, Oct 14 '11 at 13:48

score 5 · Accepted Answer · answered Oct 14 '11 at 12:50

5

Your second snippet defines a public symbol, myFunc. If anyone else is using that symbol for a library, you would overwrite it and could destroy its functionality. The first snippet doesn't have a name, and is therefore safer.

answered Oct 14 '11 at 12:50

configurator

40,828
14
81
115

score 2 · Answer 2 · answered Oct 14 '11 at 12:50

The only advantage the former has over the latter is that you aren't polluting the scope with the variable name (myFunc).

I.e. in the second example, if you already had a variable named myFunc in the same scope, its value would be overwritten by the function, where as in the first example, this wouldn't be the case.

Furthermore, the second example obviously allows you to invoke myFunc multiple times, where-as the first example permits it only once.

score 2 · Answer 3 · answered Oct 14 '11 at 12:58

2

Firstly, I think your first code snippet should be:

(function ($) 
{
   //Perform operation X
})(jQuery);

And as far as I can tell, there is no difference between both codes except that the second one creates the function, stores it in a global variable and then calls it, whether the first one create an anonymous function and calls it right away.

answered Oct 14 '11 at 12:58

Deleteman

8,500
6
25
39

The () can be done either way. JSLint prefers the parenthesis at the end, which is why I do it that way. – C.J. Oct 14 '11 at 13:03
You're right, this thread explains a bit more about this subject: http://stackoverflow.com/questions/3783007/is-there-a-difference-between-function-and-function – Deleteman Oct 14 '11 at 13:08

What is the difference between running this code in an immediate function and not?

3 Answers3