Why is this showing a behaviour as of variable hoisting?

Question

I won't say anything, just a look at the code is enough:

JS:

var myvar = "my value";

(function (){
    console.log(myvar); //returning undefined
    var myvar = "local value";
})();

Now a very simple question: The variable myvar is declared before the execution of the function, so why is the console showing undefined?

I'm unclear if you know Javascript does variable hoisting? [It does](http://stackoverflow.com/questions/3725546/variable-hoisting) — Liam, Feb 15 '16 at 16:18
You can comment the `var myvar = "local value";` and check the myvar value then — swapnesh, Feb 15 '16 at 16:21

score 3 · Accepted Answer · answered Feb 15 '16 at 16:17

You have two variables called myvar. One inside the function and one outside the function.

Inside the function you have access to the one declared inside the function (which, as you said, is hoisted). It hasn't been assigned a value at that point, so it is undefined.

One line later, you assign it a value.

score 0 · Answer 2 · answered Feb 15 '16 at 16:28

Just as an addition to Quentin's post. What your code looks like "post hoist":

var myvar = "my value";

(function (){
    var myvar;
    console.log(myvar); //returning undefined
    myvar = "local value";
})();

If you look at it this way it's obvious why it's undefined.

If you want the variable to be "My value" you can do thus:

var myvar = "my value";

(function (myvar){
    console.log(myvar); //returning "my value"
    myvar = "local value";
})(myvar);

Fiddle

Why is this showing a behaviour as of variable hoisting?

2 Answers2