explain pattern of rebinding globals to locals in javascript

Question

Possible Duplicate:
How does this JavaScript/JQuery Syntax work: (function( window, undefined ) { })(window)?

i see this pattern in the jquery source code (line 13), where they rebind 'window' and 'undefined' to locals:

(function(window, undefined) {
     window.something = 42;
     var dummy = 42 === undefined;
}(window));

i think rebinding 'window' to a local is a strict mode thing (prevents accidental access to window) - but look at how they are binding undefined to a local as well. why?

That's an interesting block of code and I have no idea what it's doing. — Jivings, Dec 21 '12 at 22:42
@JanDvorak: Setting `window.undefined = 400;` doesn't change `window.undefined` for some reason. — Blender, Dec 21 '12 at 22:46
@JanDvorak: I dunno, I just tested it on the latest FF and Chrome. — Blender, Dec 21 '12 at 22:48
@Blender IE7-9 on a blank page all let me overwrite `undefined`. — John Dvorak, Dec 21 '12 at 22:51
@Blender not really, if they all follow ES3 (which _is_ odd, especially for IE9). — John Dvorak, Dec 21 '12 at 23:01
@Blender I'm willing to do some testing with IE10 once it gets to W7. — John Dvorak, Dec 21 '12 at 23:02

score 2 · Accepted Answer · answered Dec 21 '12 at 22:51

2

In JavaScript you can assign a value to undefined, for example:

undefined=42;

The jQuery notation ensures that within the block undefined is really undefined.

According to MDN:

Starting in JavaScript 1.8.5, undefined is non-writable, as per the ECMAScript 5 specification.

answered Dec 21 '12 at 22:51

Christophe

24,147
23
84
130

I think this should stick to the standard. The JS 1.8.5 reference if I am not wrong is a Mozilla thingy – Alexander Dec 21 '12 at 23:00

score 1 · Answer 2 · answered Dec 21 '12 at 22:53

If someone somehwere changes undefined behavior of you code will be unpredicatbale:

 undefined = 42;

So you force undefined in your function to be always correct by not passing that argument during the call:

 function safe(undefined) {
   // undefined is really undefined here
 }

 function unsafe() {
   // undefined could be 42 here
 }

 undefined = 42;
 safe();
 unsafe();

Similar with window. Also passing window in give you additional adantage that you can test your function without actually impacting real window. I.e. your "mock" window can have custom setTimeout to test timing behavior of the function.

 function complex(window)
 {
    window.setTimeout(callback, 1000);
 } 

 var mockWindow = {setTimeout:...};
 complex(mockWindow);
 // here you can make sure setTimout was called and if necessary
 // call the callback.

explain pattern of rebinding globals to locals in javascript

2 Answers2