getButterfly Logo getButterfly code wrangling since 2005

jQuery/JavaScript Global VariableLast updated: April 27, 2016

A jQuery (or Javascript) global variable is a variable with global scope, meaning that it is visible and accessible throughout the program, unless shadowed.

This article deals with a problem I used to bang my head about the other day.

jQuery (or Javascript) global variables

I needed to declare a global variable inside a jQuery function (it works with regular JavaScript, too), and read it inside another function. If the first function isn’t called/initiated, the second function doesn’t know the value of the global variable.

For example, this function sets the sort order of a column of a table, nothing really interesting:

function clickMe(sortOrder) {
    sortOrderNew = sortOrder;

When the function is executed, a global Javascript variable is set. Notice there is no var in the declaration.

This line:

var sortOrderNew = sortOrder;

would set a local variable inside the said function.

Now, a second function needs this global variable. If it is set, it will automatically pick it up, if not, it will set a local variable with a fallback value:

function chipPaginate(page) {
    if(typeof sortOrderNew == 'undefined')
        var sortOrder = 3;

    if(typeof sortOrderNew != 'undefined')
        var sortOrder = sortOrderNew;


Notice I’m doing some checks to see if sortOrderNew is defined. If not, it will assign it the value of 3 (it makes sense inside my function). Again, notice I’m using var in front of my variables, to set them locally.

Global variables conclusion

if(typeof myVariable === 'undefined')

checks if myVariable is defined or not.

var myVariable = 5;

omiting var will make myVariable global (i.e. readable among functions and available to other code).

Subscribe to getButterfly Blog

Once a week or so we send an email with our best content. We never bug you, we just send you our latest piece of content.

If you found any value in this post, agree, disagree, or have anything to add - please do. I use comments as my #1 signal for what to write about. Read our comment policy before commenting! Comments such as "Thank you!", "Awesome!", "You're the man!" are either marked as spam or stripped from URL.

2 thoughts on “How to declare a global variable inside a jQuery function

  1. Hi, thanks for putting up this info. However it really is a case of (possibly) 1 reason to do this – and many reasons not to. More difficult maintanence & debugging, poor performance, are just a some of issues. Additionally your JS code is actually buggy.

    I’m not being critical. I am happy point out where you could make code healthier if you are interested? You will run into problems if you continue to code as above in JS.

    1. Hi Steve, it’s not a good idea, indeed. Global variables pollute the global domain. I’ve recently had this issue with a huge site with about 20 tracking scripts. One of them decided to use global variables, and, combined with poor naming, broke some of the site’s functionality. It took me 2 days to track it down.

      Regarding performance, I know, I was just giving basic examples. Feel free to add your feedback, and I will add them to the post.

Leave a reply

Love programming?

Learn about the most amazing things. Get smarter everyday!