In this post I'll discuss the basics of Javascript namespacing and how to implement it.

What is namespacing?

Namespacing is a technique used in many programming languages to avoid conflicts of objects and variables in the global scope. They are usually used to group objects and variables around a particular piece of functionality so that they can be uniquely identified.

In JavaScript namespacing is extremely important. Well actually the concept of in-built namespacing in JavaScript does not exist. Everything you create in Javascript is by default global. This can lead to disaster.
For example, if you have a script with certain variable and method names and another script is added on the page with the same names, then your code can and most likely will break. Creating a namespace can prevent this.

Basic Implementation - Single global variables

One simple pattern for namespacing in JavaScript is to opt for a single global variable as your primary object. This could look something like this:

var myApp =  (function(){
    function(){
        ...
    },
    return{...}
})();

One issue with this method is ensuring that no one else uses the same global variable name. You could prefix the namespace with a unique name. For example you could prefix with the application name:

var myAppVariable1 = {};
var myAppVariable2 = {};
function myAppMethod1(){...}

This is an effective method of namespacing and helps lower the chances of a variable name existing in the global scope.

Downsides of this pattern can be that as your application grows the number of global objects can become large. Also it requires that the prefix you choose is unique and not used by anyone else in the global namespace.

Object literal notation

The Javascript 'guru' Douglas Crockford describes Object Literal Notation:

In the object literal notation, an object description is a set of comma-separated name/value pairs inside curly braces. The names can be identifiers or strings followed by a colon.

Object literal notation is quite useful for creating namespaces to keep your global objects to a minimum. For example:

var myApp = function () {
return {
    name : "DopeyDev",
    getBlogInfo: function() {
        alert('Accessing Dopey Dev!');
    }
};
}();
window.onload = myApp.getBlogInfo;

Object literals help organise the code and variables logically. They differ from simple global variables in that they take into account tests for the existence of a variable with the same name so the chances of a conflict is reduced.
The best practice for testing if a variable with the same name already exists looks like:

myApp || (myApp = {});

The upside of object literals is that they offer key/value syntax. It allows us to create distinct functionality for our application in a way that clearly separates it from others. It also allows a simple way to extend your code in the future.

A downside is that object literals can grow into long confusing objects.

Nested namespacing

An extension of object literals is nested namespacing. Its another pattern that reduces the chances of conflicts occurring dues to the fact that if a namespace already exists, it's unlikely the same nested children do.

Example of nested namespacing:

myApp.getBlogInfo(1).getTitle();

You can avoid a proliferation of global names by creating a single global namespace and adding sub-modules to it. Long nesting is not advisable, because it adds complexity and is slower.

Conclusions

I personally would use nested object namespacing with the object literal pattern. Single global variables work fine but with large codebases with many developers it can become cluttered with global namespaces and can be difficult keeping them unique.

This is another dopey blog...let me know what you think.