Let It Bea
Let, or rather let, along with const, came along in the middle of last decade, and created such a shift in the paradigm of JavaScript variables that Flatiron School now advises its students to literally never use its predecessor, var. But they still taught us about it, so we won’t be helpless if and when we ever encounter it; just like self-defense, you hope you never have to use it. var doesn’t know its own limits; or rather, it doesn’t have enough of them. Remember the issue of scope that I discussed in each of my last two articles? Well, var is all over the place. Look at the following example.
I’ve built a function that includes an if statement within whose block the variable “surame” is declared with let and assigned a value. Before and outside of the if statement the variable “firstName” has been declared with let and assigned a value of its own. As one would expect when using let, the return value within the if block is able to utilize both variables, while the other return value only needs the “firstName” variable. But what if I modify the low-formality return value such that it now requires the use of both variables?
As expected, the JavaScript engine isn’t able to access the “surname” variable because the scope of a let variable is limited to its own block.
Now I modify the function again, replacing let with var.
No error this time. Why? Because the JavaScript engine runs through a compilation phase and then an execution phase. During the former, it effectively hoists all variable declarations within the function all the way up to the very top of the function, thereby endowing each of them with a scope that’s co-terminous with that of the function, whether the programmer intended it that way or not. It does this regardless of whether the variable was declared with var, let or const. But with the latter two, the engine doesn’t permit the the variable to be referenced before it’s been initialized.
var’s rather free-roaming nature makes it difficult to wrangle, and much more prone to bugs. And, as one can see only upon close examination, instead of an error, there’s just a very inconspicuous “undefined” instead of a “Mr. Gonzalez”. The sort of thing one could easily miss. A glaring error message is exponentially more helpful.
let and const are much more stable and reliable. In my next article I’ll examine the differences between them.
PICTURE FROM: