Cacher is the code snippet organizer for pro developers

$(function(){

//===========================================================
// JavaScript object 'namespace' extension experiments
// by @addyosmani (comparing deep extension in vanilla JS vs. 
// jQuery's $.extend)
//
//
// The goal here is to:
//
// (a) enable easier object namespace (and nested namespace) 
//  extension (eg. extend(namespace, nestedNamespace))
//
// (b) enable easier cached namespace extension (eg. var q = 
// ns.module1.utils.foo.bar; q.module2 = {};)
//===========================================================



console.group("jQuery $.extend namespacing");

// base namespace
var myApp = myApp || {};

// 1. can we extend the namespace with a new sub-namespace called 'utils'?
$.extend(true, myApp, { 
	utils:{
	}
});
console.log('test 1', myApp); //now contains utils
myApp.utils.test0 = 'hello world';

// 2. how about more depths?.
$.extend(true, myApp, {
	hello:{
		world:{
			wave:{
				
			}
		}
	}
});

myApp.hello.test1 = 'this is a test';
myApp.hello.world.test2 = 'this is another test';
console.log('test 2', myApp); 
/*
as expected:

	hello 
		test1
		world
			test2
			wave
	library
	utils
*/

// 3. what if myApp already contains the namespace being added (eg. 'library')?
// we want to ensure no namespaces are being overridden

myApp.library = {
	foo:function(){}
};

$.extend(true, myApp, {library:{ bar:function(){}}})
console.log('test 3', myApp); //now also contains library.foo, library.bar
// nothing has been overwritten which is what we're hoping for.



// 4. what if we wanted easier access to a specific namespace without having
// to type the whole namespace out each time?.
var shorterAccess = myApp.hello.world;
shorterAccess.test3 = "hello again";
console.log('test 4', myApp);
//success, myApp.hello.world.test3 is now 'hello again'


console.groupEnd();


});