While viewing jQuery's uncompressed source code I stumbled upon something I don't quite understand. When the create their anonymous function, they place undefined as a 2nd argument. What is this doing, and why are they using undefined? Is it necessary to put undefined as an argument in an anonymous function? Below is an example of what I am talking about.
(function( window, undefined) {
...code here
})( window );
What this is doing, is reassigning undefined to undefined inside that closure. Thats a failsafe. Because other code may accidentally do something like
undefined = something;
console.log(undefined); // will output 'something'
And thats valid in javascript(if the JS engine being used has not implemented ECMAScript 5 specification, in ECMAScript 5 spec undefined is non non-writable, MDN DOC ),
Quote from MDN New_in_JavaScript 1.8.5 (ECMA 5) Page
Changes to global objects
Global objects made read only
The NaN, Infinity, and undefined global objects have been made read only, per the ECMAScript 5 specification.
And from ES5 Annotated Spec in Guthub
ES5 spec Section x15.1.1.3
15.1.1.3 undefined
The value of undefined is undefined (see 8.1).
This property has the attributes { [[Writable]]: false, [[Enumerable]]: false, [[Configurable]]: false }.
Even if global undefined is not writable You can have a local variable named undefined and can mess up your code(mainly comparisons with undefined). But that's your responsibility. You can have codes like
(function(){
console.log('Second Case: ');
var undefined = 'Something';
console.log(undefined); // Will log `something`
var a ; // a is undefined
console.log(a === undefined); // false, as undefined is changed
// you might expect a === undefined will return true, but as
// `undefined` is changed it will return false.
console.log(a); // undefined
})();
Demo: http://jsfiddle.net/joycse06/V4DKN/
However if undefined is writeable then the above assignment may hamper many comparison made with undefined after that line of code as undefined is not undefined anymore. It has some value now.
So as they are calling that anonymous function like
( window ) // one argument only
And receiving
( window, undefined) // only window is passed when calling the function
// Second argument is not passed means it's undefined
// so undefined is restored to undefined inside that function
// and no global accidental assignments can hamper jQuery's
// code using 'undefined' now
That means inside that closure undefined is restored to undefined, as it has not been passed any value thus securing use of undefined inside that anonymous function.
A very good detailed article on this http://javascriptweblog.wordpress.com/2010/08/16/understanding-undefined-and-preventing-referenceerrors/
I am quoting some lines from the above article link to make things clear
What is undefined?
In JavaScript there is Undefined (type), undefined (value) and undefined (variable).
Undefined (type) is a built-in JavaScript type.
undefined (value) is a primitive and is the sole value of the Undefined type.
Any property that has not been assigned a value, assumes the undefined value. (ECMA 4.3.9 and 4.3.10).
A function without a return statement, or a function with an empty return statement returns undefined. The value of an unsupplied function argument is undefined.
var a;
typeof a; //"undefined"
window.b;
typeof window.b; //"undefined"
var c = (function() {})();
typeof c; //"undefined"
var d = (function(e) {return e})();
typeof d; //"undefined"
undefined (variable) is a global property whose initial value is undefined (value), Since its a global property we can also access it as a variable. For consistency I’m always going to call it a variable in this article.
typeof undefined; //"undefined"
var f = 2;
f = undefined; //re-assigning to undefined (variable)
typeof f; //"undefined"
As of ECMA 3, its value can be reassigned :
undefined = "washing machine"; //assign a string to undefined (variable)
typeof undefined //"string"
f = undefined;
typeof f; //"string"
f; //"washing machine"
Needless to say, re-assigning values to the undefined variable is very bad practice, and in fact its not allowed by ECMA 5.
Undefined is a type but is also a global variable.
You can have a module that overwrites the value of undefined by doing undefined = whatever.
undefined in the is actually an undefined parameter of a function wrapping the whole code:
(function(window, undefined) {
// undefined is the undefined parameter
}(window));
It's safe, as the undefined parameter is in local scope, and no one except the code in this function can assign to it.
It's not necessary to use undefined as parameter when define an anonymous function.
If you see above function you wll notice that it expects two parameter but one is supplied.
Why undefined need to restored?
because, to makes sure that undefined is indeed undefined in the scope between curly braces, even if someone has written something like undefined = "defined"; in the global scope, because undefined can actually be redefined.
So if you have something like
var undefined = 1;
(function(window, undefined) {
console.log(undefined); // output will be undefined not 1
}(window));
jQuery is making sure that undefined really is undefined within its scope by not passing an argument to that parameter.
Take this code for example when undefined isn't actually undefined:
var undefined = 1;
alert(undefined); // 1
