V is for var
The first and oldest example is
First we declare a variable
After we’ve declared the variable we’re going to use, let’s do something with it.
If we run this code, what would happen? If your answer was nothing, you were correct! We need to call the function to actually get a value back. Let’s do that. This is what the code looks like all together:
Let’s look at another example, but this one might trick you.
Did you get what happened here? At first
x is one so we enter the if statement, but then it gets redeclared. The
x = 1 is overwritten and we can’t access it anymore since
var is always “globally scoped”.
That’s all you need to know about var now, but we’ll get to it later why this is rarely used anymore. Trust me, it’s fun. But let’s learn about the other options first.
Let is for let me change it
Let is very similar to
var in the way you declare your variables. Instead of the word
var, you’d use
let. Okay, so what’s the difference between
let if they’re so similar? Glad you asked! The difference is the scope level. The what level? The scope level. Let me show you.
Let’s revisit the last example from
var, but change the
Do you see what changed? We have two variables, with the same name… but they don’t get overwritten? Correct! The answer for this lies in the “scope”. Since we defined the first X variable in the global scope and the second X variable in the “if statement” scope, the two don’t know of each others existence! This is a big difference compared to var. This solves a lot of weird bugs that might happen.
Another thing to note is that
let, just like
var, still allows you to change the type of primitive you assigned to it. Let’s get the same example again, but we do some reassignments.
We never get to the if statement because we changed the type and content of the variable! But… what if we’re certain we never want to change it?
Const is for staying constant
Last but definitely not least
const. This keyword is used for, you guessed it, variables that stay constant! The variables that will not change. What would such a variable look like? Well, what if we’re creating a favourite movie variable and we’re never, ever going to change our opinion? That would result in saying:
If we try and overwrite this variable, we’d get an error saying we cannot reassign the variable.
const is also block scoped.
Let's talk more about scope
But then we decide to use this variable, which is defined in the global scope, inside the scope of a function.
Okay, we've seen this example already in the explanation of
var but what else could we do? How about we add another variable to see if we can afford the car, but use this variable to determine if we can get the Mustang or we have to work a little harder.
Unfortunately I have to work a little harder still! But that's totally okay. We've made some good progress with understanding the main differences between
const. There's another thing to discuss which is hoisting, but I will write a separate blog post for that!