This isn't a specific problem, but a more theoretical question. Is there ever a good reason to expose multiple global variables for a single Javascript application?

I can see using, and often use myself, a single global variable to name an object or class containing the app so that it can be recalled multiple times (example below), but I can't think of any case when any additional global variables couldn't be replaced by object properties.

Example where an exposed variable makes life easier (using a closure, it couldn't be recalled):

var myGlobalApp = {
    init: function (args) {...},
    methodOne: function () {...},
    methodTwo: function () {...},
    propertyOne: 'string for example'
};
myGlobalApp.init(arg1);
myGlobalApp.init(arg2);

Does anyone know of an instance case where multiple global variables would be necessary?

This isn't a specific problem, but a more theoretical question. Is there ever a good reason to expose multiple global variables for a single Javascript application?

I can see using, and often use myself, a single global variable to name an object or class containing the app so that it can be recalled multiple times (example below), but I can't think of any case when any additional global variables couldn't be replaced by object properties.

Example where an exposed variable makes life easier (using a closure, it couldn't be recalled):

var myGlobalApp = {
    init: function (args) {...},
    methodOne: function () {...},
    methodTwo: function () {...},
    propertyOne: 'string for example'
};
myGlobalApp.init(arg1);
myGlobalApp.init(arg2);

Does anyone know of an instance case where multiple global variables would be necessary?

• javascript

• 2 Maybe for every reusable module that has nothing to with the app? Most prominent example: jQuery. – Bergi Commented Aug 7, 2013 at 16:10
• 1 That's why I specified in the initial question "for a single Javascript application." – Steve Crockett Commented Aug 7, 2013 at 16:11
• 2 You mean "more than one global variable per standalone module"? Actually I don't see a reason to expose any global variable from your main app routine :-) – Bergi Commented Aug 7, 2013 at 16:13
• Sure. If we're playing the semantics game then that's what I mean. And the one global variable exposed in the example would be myGlobalApp – Steve Crockett Commented Aug 7, 2013 at 16:15
• How does this feel like to you APP.domObjects.tables.dataTables.getFirst() a bit unwieldy? How big is your application and how much are you exposing the global namespace? I'd prefer to break it out into a few objects over one mammoth object. Your call. – David Barker Commented Aug 7, 2013 at 16:18

5 Answers 5

I don't think it's ever strictly necessary to have multiple globals - JavaScript objects can be arbitrarily nested, and can often be used like namespaces.

window.AwesomeModule = {
    app: {
        ...
    },
    util: {
        ...
    }
};

In fact, if your app is not made to be reusable (i.e. it's just user-facing), you could probably not leak any globals.

(function() {
    var AwesomeModule = { ... };
    // Do whatever you want - create DOM nodes, bind to events, etc
    // Just don't bind anything to window
})();

A more interesting question is whether having multiple globals would ever be genuinely useful, and I'd say that it depends on your development style. For example, if we look at C# and .NET in general, we can see that the entire framework (more or less), namespaces and all, are housed beneath a top level namespace System.

Of course, if you're going to be making some huge JavaScript app with multiple ponents, I would definitely not remend such a nested structure (besides being possibly unwieldy, JavaScript object attribute lookups have a definite runtime cost, which could add up).

...Regardless, though, the JavaScript landscape is not so well-pruned. A simple check for global attributes yields around 56 items on my machine on an empty page (running Chrome).

var i = 0;
for (var prop in window) {
    if (window.hasOwnProperty(prop)) {
        i++;
    }
}

So, although we can and should minimize our own global usage, the JS environment as it stands today (especially when using external libraries) often involved the proliferation of globals. Example: StackOverflow has around 144 total globals.

Typically libraries for client side Javascript each take at least one global because it would not be cool to require the user to use a module library.

0 global variables is a possibility in ES6 with first-class modules.

I would say the general rule that applies to Javascript and for that matter any other language is to minimize the case for global variables. I'm sure there are cases when more than one global variable is necessary but this generally should be avoided as much as possible. When building a library like jQuery you usually only need to expose one point of entry into that libraries functionality.

Also, global variables pollute the Javascript namespace and this could lead to collisions with other people's code.

The only circumstance in which I've exposed multiple globals was for an app that would run multiple instances of itself each of which needed a reference to a single unified resource for use by onclick callbacks. Even in that case, with a little extra effort I could have kept the resource contained within the app and not needed the extra global.

So in short, on rare occasion it's useful / quick & dirty, but never necessary.

Does anyone know of an instance case where multiple global variables would be necessary?

Global variables are never necessary, any JavaScript code that uses global variables can be rewritten so that it doesn't.

Even in your example global variables aren't necessary, you can instead use a self-executing function as shown below:

(function(arg1, arg2) {
    var init = function (args) {...};
    var methodOne = function () {...};
    var methodTwo = function () {...};
    var propertyOne = 'string for example';

    init(arg1);
    init(arg2);
})(arg1, arg2);

Obviously libraries will often expose a global variable for using that library, for example jQuery creates the global variables jQuery and $. But for a single JavaScript application, global variables are never necessary.