为什么要将全局变量传递给函数？

Question

I've seen the same code written both ways and wonder if there's any tradeoff between them.

Method 1:

(function(i) {
    // Do something to i now
}(global_variable))

Method 2:

(function() {
    // Do something to global_variable now
}())

Why would you pass a global variable to a function if it's going to exist in that scope anyway?

Answer 1

In this case, it gives clear instructions that this function uses a global and creates an easier to type alias. Also, it makes accessing the variable a little faster because it doesn't need to search all the scopes until it finds it in the global scope.

In the case of regular functions, not an iife as in your example, it makes your function more testable because you can mock the global that is passed in more easily.

Answer 2

for aliasing purposes for example:

(function(leeloo){

    //inside here you can use the short term

})(LeeloominaiLekataribaLaminaTchaiEkbatDeSebat)

//this would be similar, it's a matter of preference
(function(){
    var leeloo = LeeloominaiLekataribaLaminaTchaiEkbatDeSebat;

    //...
})()

or to enclose a value, like this example:

(function($){

    //in here, $ preserves the passed/injected value, 
    //even if the global value changes

})(jQuery.noConflict())

this way you could even use multiple versions of jQuery in the same page.

Answer 3

You might want to use the first example when you don't want to permanently change the value of global_variable , for some reason. Eg after executing this code the local copy will be changed but the global variable will be unchanged.

global_variable=true; (function(i){ i=false; return i; }(global_variable));

This code however, obviously alters global_variable :

global_variable=true; (function(){ global_variable=false; }());

Edit: somewhat tangentially, this variation looks like it alters the global variable, but it doesn't because calling the function creates a shadow copy of the global variable. You should probably avoid this pattern since it's likely to create confusion:

g=true; (function(g){ g=false; return g; }(g));