JavaScript | Proper way to format code

Question

I am new to JavaScript and have a question to ask. When creating a new programme is it best to create all of my functions within a global variable/object or to create them all separate.

For example this:

var register = {
    members: [],    
    Member: function(){ 
    },
    reset: function(){  
    },
    printMembers: function(){   
    },
    process: function(){    
    }
};

function init(){
    register.process();
};

window.onload = init();

Or instead like this:

var members = [];

function Member(){
};
function reset(){
};
function printMembers(){
};
function process(){
};

function init(){
    process();
};

window.onload = init();

This may be a very stupid question to ask...

It totally depends, but if functions are tightly related IMO they should be grouped to reflect this. It also avoids polluting the global namespace, which is important. — Dave Newton
– Dave Newton, Commented Oct 21, 2014 at 16:03
just for start: take a look to javascript.crockford.com/private.html — user1823693
– user1823693, Commented Oct 21, 2014 at 16:04
So both are correct but it comes down to context and situation? If the functions/methods are for the running of the programme they should be stored together? Same as if they are the methods for a certain object they should be stored together? — hudsond7
– hudsond7, Commented Oct 21, 2014 at 16:09

Rafael Eyng · Accepted Answer · 2014-10-22 13:46:11Z

2

When creating a new programme is it best to create all of my functions within a global variable/object or to create them all separate.

This is kind of opinion based, but I'll give you a good reason for creating all your properties inside a global object: you won't pollute the namespace. That means, you won't be creating a lot of global objects, that would be properties of the global object (window, in browsers).

If you use someone else's library, and if both you and him would create global objects, the script that was included later in the HTML would override properties with the same name declared in the other script.

Finishing, I would suggest you to write your code like:

var app = {};

app.members = [];

app.Member = function(){};

app.reset = function(){};

app.printMembers = function(){};

app.process = function(){};

function init() {
    app.process();
};

window.onload = init;

Also, note that you should do window.onload = init, and not window.onload = init().

The difference:

with window.onload = init, you are setting the onload property in window to be the init function. Later, when the page finishes loading, someone will ask the window to execute its onload property, and window will then do something like this.onload().
with window.onload = init(), you are executing init right there and setting the onload property of window to be the return of the execution of the init function. Since every Javascript function returns something (by default, undefined), you'll be setting window.onload = undefined. And this is not what you want.

edited Oct 22, 2014 at 13:46

answered Oct 21, 2014 at 16:27

Rafael Eyng

4,9702 gold badges37 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

hudsond7 Over a year ago

This is a very clean answer that answers the question I had exactly, even though my question was not clear.

Goodword · Accepted Answer · 2014-10-21 16:17:47Z

0

It's a matter of taste style--kindof like writing an essay. Ultimately, what's important is that anyone (or you, six months from now) can read through your code and understand what's going on. Just focus on functionality and you will naturally start making decisions about what's logical where.

(Eloquent Javascript)[http://eloquentjavascript.net//] is also a great book on the subject.

answered Oct 21, 2014 at 16:17

Goodword

1,64520 silver badges28 bronze badges

Collectives™ on Stack Overflow

JavaScript | Proper way to format code

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related