Using var in a nested function to declare a variable with the same name as a parameter of parent

Question

I'm using JavaScript to write some code and found an unexpected behaviour.

I'm using a nested function g inside f. f has a parameter named m. When using and declaring a variable inside g with the same name, something weird happens:

var f = function(m) {
    var g = function() {
        alert(m);
        var m = 0;
    };
    g();
};
f(1);

This code will result in undefined, instead of 1 which I expected.

Moving the alert statement below the var line would result in the answer 0 which makes sense.

I suppose this is because JavaScript are only using functions as name closures, var m will be attached to function g with the declaration, but m is not assigned yet at the time of alert.

But I am not sure about this, because if the function is not nested, there behaviour looks nice to me:

var g = function(m) {
    alert(m);
    var m = 0;
};
g(1);

would produce 1.

Could anyone explain? Thank you.

Is there any other code that code be affectig it? The behaviour here is not as you describe: jsfiddle.net/QvcqU — shanethehat
– shanethehat, Commented Apr 5, 2011 at 8:48
@herostwist: yes, it's undefined. I have edited the question. — Ryan Li
– Ryan Li, Commented Apr 5, 2011 at 8:57
The reason the second one produces 1 is because you have m as a formal parameter, then pass 1 to the function so it is assigned a value when the function is called. Later, m is set to 0 when the assignment m=0 is processed. — RobG
– RobG, Commented Apr 5, 2011 at 8:57

davin · Accepted Answer · 2011-04-05 08:54:34Z

8

Javascript uses function-scope, meaning that variables' scope is not like C's block-scope coming into and out of scope according to {}, but rather objects come into and out of scope by functions' beginnings and endings. As such, every local variable you define in a function is declared from the beginning of the execution of that function, and will be of type undefined until you initialise it in your function.

As such, when g executes, since it will create at some point the local variable m, the runtime already declares that there is a local m (which obviously hides the external m of the f function) with type undefined from the beginning of g's execution

See https://developer.mozilla.org/en/JavaScript/Reference/Scope_Cheatsheet which explains that when you do var varName it hoists the variable to the top of the function scope. That page has lots of great examples, here's one quote that sums it up:

Every definition of a variable is really a declaration of the variable at the top of its scope and an assignment at the place where the definition is.

edited Apr 5, 2011 at 8:54

answered Apr 5, 2011 at 8:49

davin

45.6k9 gold badges81 silver badges78 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

xixixao Over a year ago

Although this explanation is sound, I don't think it answers the question, namely why parameters are treated differently from definitions in outside scope. I guess the answer very well might be: that's just how it is.

Collectives™ on Stack Overflow

Using var in a nested function to declare a variable with the same name as a parameter of parent

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related