JavaScript Block Scoping

Variables declared with var do not have block scope. This is because block statements do not introduce a scope and the var keyword attaches variables to an enclosing function. Below, the var x statement within the block is in the same scope as the var x statement before the block.

See the Pen thecodelog.com - JS Block Scoping 1 by Deano (@deangilewicz) on CodePen.

Identifiers declared with let and const do have block scope. The let keyword attaches the variable declaration to the scope of whatever block it’s contained in.

See the Pen thecodelog.com - JS Block Scoping 2 by Deano (@deangilewicz) on CodePen.

A good practice is to use var for function wide variables and use let for block variables. Below, is a non block scoping example where the coolThing variable is used only in the context of the if statement, however, where we declare variables is not relevant when using var, because they will always belong to the enclosing scope.

See the Pen thecodelog.com - JS Block Scoping 3 by Deano (@deangilewicz) on CodePen.

Below, is a block scope example.

See the Pen thecodelog.com - JS Block Scoping 4 by Deano (@deangilewicz) on CodePen.

A try / catch is also an example of block scope:

See the Pen thecodelog.com - JS Block Scoping 5 by Deano (@deangilewicz) on CodePen.