Declaring a variable in Javascript
Explaining the ways of declaring variables in JS.
Declaring variables is an essential skill in every programming language. Many courses explain creating a variable and assigning a value to it with empty boxes that you can fill with specific things.
You can find a container and its contents by looking up a label that you gave to it. In a programming language, we refer to the label as a name, the box is our type, and the thing we put inside is our value.
There are limitations to this concept. It is too simple and thus cannot explain some of the ideas of variable declaration. Inheriting this concept will leave you struggling, especially with reference concepts. It is tough to interpret the following example with the concept of boxes:
Assigning a value to a variable can be best described as putting a link between the value and the variable. You all know those images of telephone exchange operators. As a programmer, you do the same thing with variables. The above mistake is simple to explain with the concept of links. The leia and vader objects are linking to the same father object, thus sharing the corresponding value.
Let us now take a look at how to declare a variable in JavaScript.
Declaring a variable with var
Declaring a variable with var has been mainly abandoned and is strongly discouraged. We still want to look into the reasons for it.
1. var is function-scoped!
If you come from another C-like programming language you may already know that curly braces declare a so-called block. Common variable declarations are block-scoped (e.g., not accessible outside the curly braces). var is function-scoped, which means that a declaration with var is known to the entire function. If declared outside of any function it is even known to the entire script. This can lead to unwanted errors.
2. var gets hoisted.
Consider the following code example:
You can access a variable before it has been declared, but it does not hold a value. This is due to the fact that JS rewrites the above code to this:
This is true for functions and assignments with var.
3. var can be reassigned.
This does only work with strict mode turned off. It is another example that working with var is prone to errors.
Declaring a variable with let
If you are familiar with other programming languages then let will behave as you would expect from declaring variables. In other words: let is block-scoped. In stark contrast to var, the variable will not be hoisted when declared using let.
The part of the code where city is unknown to the program is often referred to as “Temporal Dead Zone” (TDZ). If you want to scope a variable that has been declared using let it is enough to create a new block, instead of declaring a new function. Variables declared in a parent scope are also known to the child's scope.
Trying to redeclare let will throw an error.
Declaring a variable with const
const behaves like let in many ways. But unlike declarations with let,
- you must initialize
constwith a value - you cannot assign another value, but
constis also not immutable
So after assigning an array or object, you will still be able to manipulate it, but you are not able to assign a new value to a constant after initialization.
What to use when?
It is easy: Always use const until you get an error, then use let.
That’s all, folks!
