Can anyone help me with this weird behaviour of var in javascript?

Question

How does the fruit variable gets overwritten in the if block, but the color variable doesn't gets overwritten in the function block ?

var fruit = "apple";

if(fruit){
    var fruit = "mango";
    console.log(fruit); // mango
}

console.log(fruit); // mango

var color = "blue";

function displayColor(){
    var color = "red";
    console.log(color);
}

displayColor(); // red

console.log(color);  // blue

see this answer: https://stackoverflow.com/a/9311553/3462319 — depperm, Oct 22 '21 at 14:07
For this you would need to understand hoisting and block scopes in JavaScript. — Sumit Surana, Oct 22 '21 at 14:08
Does this answer your question? [javascript variable scope in the IF statement](https://stackoverflow.com/questions/6964895/javascript-variable-scope-in-the-if-statement) — Justinas, Oct 22 '21 at 14:10
Hi the fruit variables are in the same scope, but the color variable inside the function is in other. Regards — Carles Ramos, Oct 22 '21 at 14:39

score 1 · Answer 1 · answered Oct 22 '21 at 14:11

The difference is the function creates a local scope. So it creates a variable in the function scope and discards it when the function is done, leaving the GLOBAL color variable untouched.

If statements dont make a scope, so your just redefining the fruit variable in global scope.

Can anyone help me with this weird behaviour of var in javascript?

1 Answers1