javascript organisation

Question

I came across this Q/A on javascript code organisation.

var DED = (function() {
var private_var;
function private_method()
{
 // do stuff here
}
return {
 method_1 : function()
 {
 // do stuff here
 },
 method_2 : function()
 {
 // do stuff here
 }
};
})();

Currently I do this,

 var DED = new Object;
 DED = {
 sidebar : {
 method_1 : function (data){
 //some stuff
 },
 method_2 : function(data){
 //do more
 }
 },
 main : {
 //.......
 },
 globalVariables : {
 //...
 }
 }

What is the advantage of one over the other?
Warning: newbie here.

• jwueller: This would be much easier to answer if the first and the second example would use the same names.
• kioopi: minor remark: you don't need to initialize DED as a new Object. The object-literal notation in the next line will do the same thing. Just don't forget the 'var' if you want local scope.
• jamiebarrow: @kioopi if you did forget 'var', does that mean it would bind DED to the window.DED property (assuming it's running in a browser)?
• kioopi: @jamiebarrow yes, exactly. it's a very bad part of javascript to default to global scope.

Answer 1

As indicated, that method uses closures to implement private functions and data. It's an alternative to the constructor method (below). E.g.

var DED = new (function()
{
 var private_var;
 function private_method()
 {
 // do stuff here
 }
 this.method_1 = function()
 {
 // do stuff here
 };
 this.method_2 = function()
 {
 // do stuff here
 };
})();

With the DED method shown in your question, there is no constructor. Rather the function returns an object created from an object literal. The functions in that object have the private variable and method closed into them.

• Mr Hyde: after using them, realised that constructors are awesome

Answer 2

What you return from the anonymous self-calling function (function(){})() is the interface you publish for your "module" (DED).

DED.method_1() is public. private_method/private_var are not accessible from outside but everything inside of your self-calling function has access to them.

If you like this kind of access-control this is a good way to prevent other developer from accidentally messing with the internals of your module. In a lot of cases i'd just go for a naming convention like a leading underscore to indicate internals.

Javascript is very dynamic and if someone really wants to mess with code they have no write-access to they will be able to do so. Edit: This turns out to be a wrong assuption and not the case for private data in constructors or closures. Please, see: http://www.crockford.com/javascript/private.html

• Mr Hyde: hmm, the 'access-control' makes a lot of sense. Am learning presently, so never thought of 'other developers' creating problems
• Matthew Flaschen: How exactly do you think other code could access the private variables?
• kioopi: Interestingly, i stumbled on an edge-case where closured private members might be accessible: jsfiddle.net/cmsalvado/87C7c It uses the non-standard property 'caller' of arguments.