I'm trying to change a global variable by setting it as a parameter in a function. The problem I'm running into is that my global variable does not change when I change the local variable. I understand that the scope of the variables is what's causing this, but I do not know how to make it work. Here is the code I'm using:

    var blnUpgradeGlobal;

    function SelectUpgrade(strUpgradeName, blnUpgradeLocal) {
        if (blnUpgradeLocal) {
            blnUpgradeLocal= false;
            $("#" + strUpgradeName).css("background-color", "#EAC300")
        }
        else {
            blnUpgradeLocal= true;
            $("#" + strUpgradeName).css("background-color", "Lime")
        }
    }

<div id="Upgrade1" onclick="SelectUpgrade(this.id, blnUpgradeGlobal)">
Content
</div>  

So What I'm trying to acplish here is so that when the user clicks the div, it toggles the boolean global variable set in the onClick event. I don't want to specify the exact variable in the function because I would then need to write a big nested if statement because there are a bunch of upgrades.

Thank you in advance.

I'm trying to change a global variable by setting it as a parameter in a function. The problem I'm running into is that my global variable does not change when I change the local variable. I understand that the scope of the variables is what's causing this, but I do not know how to make it work. Here is the code I'm using:

    var blnUpgradeGlobal;

    function SelectUpgrade(strUpgradeName, blnUpgradeLocal) {
        if (blnUpgradeLocal) {
            blnUpgradeLocal= false;
            $("#" + strUpgradeName).css("background-color", "#EAC300")
        }
        else {
            blnUpgradeLocal= true;
            $("#" + strUpgradeName).css("background-color", "Lime")
        }
    }

<div id="Upgrade1" onclick="SelectUpgrade(this.id, blnUpgradeGlobal)">
Content
</div>  

So What I'm trying to acplish here is so that when the user clicks the div, it toggles the boolean global variable set in the onClick event. I don't want to specify the exact variable in the function because I would then need to write a big nested if statement because there are a bunch of upgrades.

Thank you in advance.

• javascript
• variables

• 1 Once you set it as function parameter - it will be treated as local variable and the global one won't change! – Nir Alfasi Commented Jun 18, 2013 at 22:12
• Is blnUpgradeGlobal used anywhere else, i.e. has it been initialized with a value? – Nolo Commented Jun 18, 2013 at 22:15
• @Nolo, well any defined variable in JavaScript is initialized with undefined, which is falsy. – Kijewski Commented Jun 18, 2013 at 22:15
• @Kay I understand that much :) My question is on the order of the hard problem of frame of reference... I've been there. – Nolo Commented Jun 18, 2013 at 22:19
• I'm sorry, I prematurely submitted my question. What I'm really trying to do here is temporarily link the global variable a local variable so that I do not need to specify the global variable in the function. There are several other upgrades so it would bee messy if I had to use a nested if or switch statement. – Vandel212 Commented Jun 18, 2013 at 22:19

3 Answers 3

There are 2 possible options:

1. Change the 2nd parameter name (from blnUpgradeLocal to something else) in the function declaration

2. Change the global variable value using window.blnUpgradeGlobal reference

The former is better

a global var can be accessed and changed anywhere in the code.
Get rid of the parameter and then use it.
What is happening is that you are passing in the value of the global but only changing the value of the local var because the local namespace is searched first

I don't want to specify the exact variable in the function because I would then need to write a big nested if statement because there are a bunch of upgrades

Then your best bet is to have all those global variables wrapped in an object (it's also less pollution in the global namespace). Something like this:

var globalVars = {
    foo: true,
    bar: 1,
    baz: 'foo'
};

Then, in your function, just reference the object (you may pass it instead, if it's not global):

function doStuff(glb) {
    glb.foo = false;
    glb.bar = 2;
}
doStuff(globalVars);