Can we access a variable declared using 'var' keyword inside a block?

Question

A variable is declared using 'var' keyword inside a block ( {...} ). Can we access that variable outside the block? I searched on several websites and the answer was 'yes'. 'Yes we can access the variable' it said. But when I executed this on a browser console it said "the variable is not defined". Any thoughts why this is so?

Here's the screenshot of the same

I expected it to give 12345.

Answer 1

A variable is declared using 'var' keyword inside a block ( {...} ). Can we access that variable outside the block? I searched on several websites and the answer was 'yes'.

tldr; It's more precise to say Yes, unless that block is a function body.

---

var scopes a variable to the nearest function.

The body of the function (excepting some arrow functions) is a block.

Not all blocks are associated with functions.

{
    var inBlock = 1;
}

console.log(inBlock); // This logs 1

function aFunction() {
    var inFunction = 2;
}

aFunction();

console.log(inFunction); // This triggers a reference error

Answer 2

After execution of the function, the variable will no longer be available and it will be referencing the globally scope which don't have your variable.

Answer 3

You can access the variable but that doesn't necessarily mean your variable will actually have a value before passing through said block.

var will be known throughout the entire function. So if you declare var x at the end of your function (or in an if-block nested in a while in another while) and assign it there, you will be able to call it at the start of the function, but the value will be "undefined" since it hasn't been assigned a value yet at that point of the execution.

Hence why var needs careful consideration on usage to make sure you actually need said variable outside the block where you're using/initializing it.

for-loops are (in my opinion) easiest to explain this with:

for( var i = 0; i < arr.length; i++ ) {
    // do something
};

The variable i here will actually be known OUTSIDE the for-loop. It will be undefined before going through the for loop and will have the value of the last iteration after the for loop. (As oppposed to using let which will make it so variable i is not known outside the for-loop)

Answer 4

Variables declared with var has global and function scope but does not have block scope. Which means these variables are only accessible inside a function or globally.

// if we try to access it from function scope, it is not accessible
function greeting() {
  var sayHi = "Hello"
  return sayHi
}

console.log(sayHi) // sayHi is undefined. Because it has function scope



// if we try to access it from block scope, it is accessible.
if (1 < 2) {
 var sayBye = "Bye"
}

console.log(sayBye) // prints 'Bye', because it has no block scope