One of the first things you learn programming in JavaScript is, "Global variables are evil." This is especially true when writing a JavaScript library, but I'd take that advise even otherwise to avoid unnecessary headaches.
As an avid jQuery user, one thing I do in almost every project is define a namespace function on the jQuery object.
jQuery.namespace = function(ns, obj) {
var ns = ns.split('.'),
p = window,
i;
for(i=0; i<ns.length; i++)
p = p[ns[i]] = p[ns[i]] || {};
if (obj)
jQuery.extend(p, jQuery.isFunction(obj) ? obj(p) : obj);
};This function will take in either an object or a function that takes in an object, then create the namespace or extend it if it exists.
// Example 1
$.namespace('foo.bar', {
myVar: 1, myOtherVar: 2, someFunction: function() { alert(this.myVar + ',' + this.myOtherVar); }
});
foo.bar.someFunction();
//--> alerts "1,2"
// Example 2
$.namespace('faz', { baz: { a: 1, b: 2 } });
$.namespace('faz.baz', function(old /* previous namespace */) {
old.a = 'new value'; // change previous assignment of a
old.printMe = function() { alert(old.a + ',' + old.b); };
});
faz.baz.printMe();
//--> alerts "new value,2"The second example shows a case where an function is passed instead of an object. This is useful for many reasons which I won't get into... actually you can read a great post here about JavaScript module patterns.
And when jQuery isn't being used on a project, the following does the exact same.
function namespace(ns, obj) {
var ns = ns.split('.'),
p = window,
i, k;
for(i=0; i<ns.length; i++)
p = p[ns[i]] = p[ns[i]] || {};
if (obj) {
obj = obj instanceof Function ? obj(p) : obj;
for (k in obj) {
if (obj.hasOwnProperty(k))
p[k] = obj[k];
}
}
}