CODEWITHSUNDEEP
javascript
ajax333221
ajax333221

Reputation: 11764

Understanding Local Scope

I can't manage to change the value of 'i' no matter how hard I try...

My code is the following:

function changeValue(){
    //neither 'var i=99;' or 'i=99;' interferes with the 'i' on myFunction
}

function myFunction(){
    var i;

    for(i=0;i<3;i++){
        alert(i);
        changeValue();
        alert(i);
    }
}

myFunction();

My question: How can I change the value of 'i' (on MyFunction) using the changeValue function?

Also: I badly need read some guides about this, could someone give me a link to a good one?

Upvotes: 1

Views: 156

Answers (6)

gilly3
gilly3

Reputation: 91497

Move changeValue() to be in the same scope as i:

function myFunction(){
    var i;
    for(i=0;i<3;i++){     
        alert(i);     
        changeValue();     
        alert(i);     
    }
    function changeValue() { i = 99; }
}

Or, put i in the same scope as changeValue():

var i;
function changeValue() { i = 99; }
function myFunction(){   
    // var i; // don't define i here
    for(i=0;i<3;i++){     
        alert(i);     
        changeValue();     
        alert(i);     
    }     
}

Alternatively, you can tell changeValue() what the value of i is, then have it return the new value:

function changeValue(i) {
    return i + 1;
}

Then:

i = changeValue(i);

Edit: To illustrate scope:

var a = 0;  //  global scope - accessible everywhere via a
            //  unless overridden by a locally scoped a
            //  always accessible via window.a

function doSomething () {
    var a = 1;  //  local scope - you can still access window.a
    var b = 2;  //  local scope - accessible to child scopes, but not global scope

    function innerFunction () {
        var a = 3;  //  you no longer have access to the parent function's a variable
                    //  you can still access window.a
        var c = 4;  //  only accessible here (since no child scopes exist)

        alert(window.a);  //  0
        alert(a);         //  3
        alert(b);         //  2
        alert(c);         //  4
    }

    innerFunction();

    alert(window.a);  //  0
    alert(a);         //  1
    alert(b);         //  2
    alert(c);         //  undefined - unavailable in this scope
}

doSomething();

alert(window.a);  //  0
alert(a);         //  0
alert(b);         //  undefined - unavailable in this scope
alert(c);         //  undefined - unavailable in this scope

Upvotes: 2

Jim Jose
Jim Jose

Reputation: 1319

when you are using var within myFunction, it becomes a local variable in that scope. So you can't access it anywhere outside not matter how hard you try.

Use window.i instead of var i in both places and it should work,

You can simply avoid window. and use i directly without var prefix or even place the var i declaration outside both the functions... but effectively the variable become a part of the window object. (In general all global variable in JS are part of the window object)

Upvotes: 0

goto-bus-stop
goto-bus-stop

Reputation: 11824

Both changeValue and myFunction exist in the global scope. If you define i in myFunction, it's only accessible inside myFunction and its children, functions defined inside myFunction. The 'scope chain' (I'm just thinking up a word for it) looks like this:

myFunction <- window

changeValue also exists in the global scope. It is called from myFunction, but that doesn't change the scope in which it exists. Its scope chain is like this:

changeValue <- window

If you only use changeValue inside myFunction, you can do this:

function myFunction() {
  function changeValue() { /* stuff */ }
  /* more stuff */
}

changeValue's scope chain is now like this:

changeValue <- myFunction <- window

As i exists in myFunction, it now also exists in changeValue.

Upvotes: 0

arb
arb

Reputation: 7863

You can only manipulate variables that are inside your scope. Currently, the scope of i is confined to myFunction().

This is an excellent article to get you started understanding the scope rules in JavaScript.

Upvotes: 0

Phil-R
Phil-R

Reputation: 2253

You could simply return the value :

function changeValue(i) {
 return i + 2;
}

 for(i=0;i<3;i++){ 
        alert(i); 
        i = changeValue(i); 
        alert(i); 
    }

Upvotes: 1

Michael Sazonov
Michael Sazonov

Reputation: 1533

function myFunction(){
    var i;

    for(i=0;i<3;i++){
        alert(i);
        i = changeValue();
        alert(i);
    }
}

while changeValue():

changeValue(){
return new_i;
}

Upvotes: 0

Related Questions