What is the use of passing global variables to functions through arguments in javascript?

Question

I see some self executing function, where the global variable is passed as an argument, even though the global variables are accessible inside the function.

var MyApp = {};
(function(app) {
    //Do something with app varaible.
})(MyApp);

is there any reason to pass them to the functions through arguments?

possible duplicate of [Why define anonymous function and pass it jQuery as the argument?](http://stackoverflow.com/questions/10371539/why-define-anonymous-function-and-pass-it-jquery-as-the-argument) — epascarello, Jan 10 '14 at 19:25
@surendran i answer that to you bellow, the reason is because you can rename you globals to another name known only inside the closure private context. you could also do function Closure(){ var app = MyApp; } Closure(); but that is not very pretty, considering you could had done a closure.. — João Pinho, Jan 10 '14 at 19:42
@surendran The first answer says why, it is not related to jQuery. The module pattern... — epascarello, Jan 10 '14 at 19:49

score 2 · Accepted Answer · answered Jan 10 '14 at 19:08

2

Function arguments, as well as variables declared with var inside the scope of the function, are scoped locally and shadow any values for the same variable in outer scopes.

In your example, this allows $ to have a value outside of the function, and it is only temporarily switched to the jQuery object while inside the function.

$ = "stuff";
console.log($); // "stuff"

(function($) {
    console.log($); // the jQuery object
})(jQuery);

console.log($); // "stuff"

answered Jan 10 '14 at 19:08

Platinum Azure

45,269
12
110
134

I remember reading some where saying, this helps to reduce the amount of overhead of looking up the global variable, is that also a reason ? – suren Jan 10 '14 at 19:25
@surendran Yes, this is true. When doing a bare variable lookup (i.e., not prefixed by `this`), first the innermost function scope is examined, then the next one out, then the next one... until it finally gets to global scope. If you are working in a deeply nested function, it makes sense to have a local reference. That said, it's probably not a critical optimization for most use cases. – Platinum Azure Jan 10 '14 at 22:06

João Pinho · Answer 2 · 2014-01-10T19:49:36.513

Considering your initial code with jQuery:

Is just to help writing code, some programmers get addicted to the $ so they pass the jQuery as arguments and call it $. That code is a better way of doing this $=jQuery, in codes where other frameworks already user $, $=jQuery would overwrite other API code... You typically see that kind of code construct when you use jQuery along with other conflicting libraries that forced you to call jQuery.noConflict().

jQuery.noConflict() removes you the $ functions where you previously were able to do this $('div')... so to keep using $ as before, in code where you know that $ should mean jQuery then you declare code like:

(function($){
   ...
})(jQuery);

About the closures in general:

This is useful in other cases, imagine you have huge function working using the jquery $ variable and then you add a library to your project that conflicts with $, the closure above would help you in not re-write the code, you could wrap it inside the closure an user $ inside.

Just one more thing, for clearness, (function(){})() is called a closure because you declare an anonymous function an then you execute it, which means you create a private context inside that function.

link about closures: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Closures

The why for passing globals as parameter to closures, is because when you pass the globals as parameters to locals you rename that global to another name inside of the closures context only. This is a controlled way of saying "hey here jQuery is called $ and jQuery".

Is it not just to help addict programmers (lol), this allow better script minification too ;) Ok, not really here because $ is only one character but... — A. Wolff, Jan 10 '14 at 19:12
yes, but the main reason the code he posted was because of this i'm saying in my answer. — João Pinho, Jan 10 '14 at 19:13
my question is mainly based on knowing the reason behind passing global variable as arguments, I could have given some other example code. — suren, Jan 10 '14 at 19:18

What is the use of passing global variables to functions through arguments in javascript?

2 Answers2