Using global variables in JavaScript is bad and can tick off other developers. Use Closures to group your variables with proper scope and stop watching your back in JavaScript User Group meetings.
Here’s what I mean:
When you make a variable or function in JavaScript by default it’s defined on the global object and it can be accessed from anywhere. Now we all know global objects are BAD – The names can conflict with other libraries, increase memory usage, make debugging a huge pain, etc. In JavaScript, the answer is to “enclose” your variables in a function. The cool cats call this a “Closure.”
Here’s what I do:
var DirksApp = DirksApp || {}; (function () { var privateVariable = "I'm Private!"; this.publicVariable = "I'm Public to the World!"; }).apply(DirksApp); console.log(DirksApp.publicVariable); //prints: I'm Public to the World! console.log(DirksApp.privateVariable); //prints: undefined
Instead of creating privateVariable
and publicVariable
in the global namespace, I’ve enclosed it in an “object” called DirksApp
. By declaring privateVariable
with var
it is only accessible from the inside of DirksApp
. Declaring publicVariable
on this
makes it publicly accessible off of DirksApp
.
Just remember:
var
for privatethis
for public
The initialization var DirksApp = DirksApp || {};
and apply(DirksApp)
pieces allow the same Closure to be used in multiple files and will combine the objects. You’ll appreciate this when your application gets bigger and you want to split the code up into module files. The JavaScript apply
method also sets “this
” inside the closure to DirksApp
, that’s why applying a new function on “this
” assigns it as a public function on DirksApp
.
You may have to read that last paragraph again. I was confused even writing it. And there’s definitely more to it, but this is a quick and dirty tutorial. Look up JavaScript Scope and IIFEs (iffys) for more info.
So, please, stop polluting the global namespace. You can start by using Closures to make your JavaScript code a bit more maintainable and you’ll make more JavaScript friends in the process.
Special thanks to Paul Sanchez, @basicdays, who presented similar content for the Milwaukee JavaScript User Group and gave me the oomph to get this article out the door.
Leave a Reply