Question

The jQuery source is wrapped in a closure, like this:

(function(window, undefined) {
   //awesome jQuery library code in here
})(window);

I don’t understand why either of these parameters are needed.

Since window is a global variable, why does it need to be passed in? What’s the purpose of passing in a global parameter and accessing it inside the closure with the same name?

What’s the undefined parameter for? Why isn’t any value passed to it?

Answer 1

I’m pretty sure this has been answered already, but:

• passing in window a) allows code compression to munge the name (i.e. replacing it with a single-letter variable name within the anonymous function) and b) ensures that the variable references the window object at the time the library is defined, just in case anyone redefines window in the global scope after jQuery is loaded.

• including undefined as an argument (but not passing in a value) does the same thing for undefined, allowing variable munging and avoiding problems if the undefined variable is redefined (yup, Javascript allows this).

I believe in both cases this is supposed to speed up references to the variable, as it makes both global variables available in the function scope, which the interpreter will search before looking in the global scope. But I can’t honestly imagine that the performance difference here is substantial – I think the biggest issue is the variable name munging, which makes for more compact code when minified.