Created
October 28, 2014 14:48
-
-
Save ChaseFlorell/7a1456771baffeb04ddc to your computer and use it in GitHub Desktop.
Namespacing Javascript
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// self executing function keeps code off of the global namespace. | |
(function() { | |
// initialize the namespace at the top of your very first code file. | |
var ns = {}; | |
// begin declaring some classes | |
// This class is using the OBJECT LITERAL pattern | |
ns.Class1 = { | |
foo: 'ns.Class1.foo', // Easy to set a public variables / properties | |
bar: function() { // you can also do methods | |
return 'ns.Class1.bar()'; | |
}, | |
x: { | |
y: { | |
z: 'ns.Class1.x.y.z' // deep nested methods work as well | |
} | |
} | |
}; | |
// assuming you have multiple files in your project, | |
// you can extend the namespace in separate files as well | |
// just make sure to check for an existing namespace variable first | |
// *note: this will fail jslint simply because it's in the same file* | |
var ns = ns || {}; | |
// extending the namespace with multiple classes | |
// is as easy as duplicating the above Class1. | |
// still using the OBJECT LITERAL pattern | |
ns.Class2 = { | |
foo: 'ns.Class2.foo', | |
bar: function() { | |
var priv = 'ns.Class2.bar().priv'; // this variable is inaccessable / private | |
return 'ns.Class2.bar()'; | |
}, | |
e: { | |
x: { | |
a: { | |
m: { | |
p: { | |
l: { | |
e: 'ns.Class2.e.x.a.m.p.l.e' | |
} | |
} | |
} | |
} | |
} | |
} | |
}; | |
// some classes might also need to have private variables | |
// you can see how to do that here. | |
// *note: newing up the function is used to not have to call ns.Class3().pubFunc(), | |
// though it does fail jslint* | |
// This class is using the MODULE pattern | |
ns.Class3 = new function() { | |
var priv = 'ns.Class3.priv'; | |
this.pubVar = 'ns.Class3.pubVar'; | |
this.pubFunc = function() { | |
return 'ns.Class3.pubFunc()'; | |
}; | |
}(); | |
// another way to do the MODULE pattern | |
ns.Class4 = function(){ | |
// these are all private | |
var privVar, privMethod | |
privVar = 'ns.Class4.priv'; | |
privMethod = function(foo){ | |
console.log(foo); | |
}; | |
// these are public | |
return{ | |
pubVar: 'ns.Class4.pubVar', | |
pubMethod: function(){ | |
return 'ns.Class4.pubMethod' | |
} | |
}; | |
}(); | |
// here's another way to achieve public and private functions | |
// This class is using the REVEALING MODULE pattern | |
ns.Class5 = function() { | |
var priv = 'ns.Class5.priv'; // variables are private | |
function _pub() { | |
return 'ns.Class5.pub'; | |
} | |
return { | |
pub: _pub | |
}; | |
}(); // the parens here cause the anonymous function to execute and return | |
//******************* | |
// Test the calls here | |
alert(ns.Class4.pubMethod()); | |
})(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment