In usability we trust

Global variables in Javascript

Global variables are evil. Although possibly nifty for very small programs it quickly clutters the global namespace and increase the risk for name collisions as are program grows larger. The risk for collisions are even greater when using different libraries and widgets.

There are three ways to define a global variable in Javascript.

The first way is to declare the variable outside of any function.

var myGlobalVar = value;

The second way is to assign it as a property to the global object, which in web browsers are the window object.

window.myGlobalVar = value;

The third way is to use it without defining it. In this case it doesn’t matter if it’s inside of a function or not. This is called implied global.

myGlobalVar = 'Hello world';

A great way to minimize the use of global variables is to store them all in one global object. By doing this you can keep all you variables and functions in one place, greatly reducing the risk for name collisions.

// Define your global object
var myObj = {};
// Add property (variable) to it
myObj.myVar = 'Hello world';
// Add method to it
myObj.myFunctions = function() {
    // Do cool stuff
};

The Javascript language was designed with global variables like this to make it easy for beginners to start coding. The side effect being that it’s easy to forget to define a variable and thereby creating bug that are hard to discover. So do yourself a favor and avoid global variables whenever possible.

Share this article

  • del.icio.us
  • Twitter
  • Facebook
  • LinkedIn
  • Digg
  • StumbleUpon
  • Google Bookmarks
  • Mixx
  • Print

Comments

RSS feed for comments on this post

1. February 12th, 2009 at 19.36 by Jan Seidl

Yeap, objects are awesome. I think the JS frameworks are giving a new step to the language. OOP is being more and more present into a language that people underestimated for years in a row.

Like happened to C when became C with Classes (C++), is JavaScript evolving to JS++ ?

2. February 12th, 2009 at 19.45 by Gabriel Svennerberg | Author comment

Yes, a lot of things has happened with Javascript the last few years. It has changed status from being considered a second grade language to proving to be really useful. I too think the js frameworks have helped making it more useful and popular.

The object model in Javascript is really cool. But it’s also widely misunderstood since it depends on prototypal inheritance which is not well understood by most people coming from languages with classical inheritance.

The more I learn about Javascript, the more I like it. No doubt it contains a lot of serious flaws, like global variables. But once your recognize them you can avoid them.

3. March 17th, 2009 at 15.55 by Mats

Om du gillar globala variabler kanske denna sidan är av intresse… :)

http://mankz.com/code/globalcheck.htm

4. March 17th, 2009 at 17.09 by Gabriel Svennerberg | Author comment

Mats: Well I’m not particularly fond of Global variables since they are EVIL, but that’s a pretty interesting tool you’ve built. Some libraries really do clutter the global namespace.

Thanks for the link!

Leave a comment

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>