Scoping Variables With A Block Statement
06 November, 2020
A block is simply any code wrapped in curly braces { }
.
In JavaScript, you can use block scope and the let
keyword to your advantage by defining variables that are only available to a block rather than polluting the global scope.
Let’s look at two examples:
const dateStr = '2020-05-04';
var [year, month, day] = dateStr.split('-');
// 'year' accidently gets redefined on the global scope
var year = '1982';
let parsedDate;
parsedDate = Date.parse(year, month, day);
console.log(parsedDate);
// Expected: 1577836800000
// Actual: 378691200000
The year
varibale is available on the global scope and could easily be redefined causing an unexpected final result.
Here’s how block scope can fix this.
const dateStr = '2020-05-04';
let parsedDate;
var year = '1982'; // Gloabl year variable
{
let [year, month, day] = dateStr.split('-');
parsedDate = Date.parse(year, month, day);
}
console.log(parsedDate);
// Expected: 1577836800000
// Actual: 1577836800000
We now have a global year
variable and block scoped year
, month
and day
variables. Assigning a value to parsedDate
is handled within the block scope so the actual result matches our expected result.