What is the difference between var, let and const? — Transcript

Transcript of the free Vue.js lesson What is the difference between var, let and const?watch the video lesson.

In ES5, we only had one keyword in order to declare variables, namely var. However, in ES6, we get two extra keywords, const and let. For example, const name equals Lydia. Variables declared with a const keyword cannot be reassigned, since the reference to their value is read only.

My name is Lydia, and I'm not planning on ever changing that. So in this case, the variable name will always hold the value of the string Lydia. Say that I somehow changed my mind and I want to change it to my second name, so name equals Julius. You can see that it throws an error because name is read only.

In this case, I should have declared the variable name with a let keyword. Variables declared with a let keyword can be reassigned. Now you might wonder why you would ever use let instead of var, since you can also re-declare variables with the var keyword. Besides a different keyword, there are more differences between const and let and the var keyword.

So let's write a quick for loop that logs the current index. Here we declare the variable i. And since we declared it with the var keyword, we can also use it outside of the for loop. So let's log the index of i outside the for loop.

Now let's see what happens when we change the var keyword to the let keyword. It throws a reference error. And this happens because variables declared with a const or let keyword are block scoped. And a block is everything between curly brackets.

In this case, the curly brackets of the for loop. So the value of the variable i is only accessible within the for loop and not outside of it. Now let's say that we have a function called checkPassword. to which we pass a password.

In here, I want to check whether the password given by the user is valid, by simply checking if the length is bigger than 6. So I create a variable called valid, which is either true or false, based on whether the length of the password is bigger than 6. length is bigger than 6. Only if the password is valid, I want to log a simple string to the console saying that the password is valid.

Else if it's not valid, I want to return a string saying that password is not valid. So if valid, we declare a variable message with a string saying that your password is valid. So const message equals your password is valid. Else if it's not valid, we declare a variable message with a string saying that your password is not valid.

Now let's invoke this function and see if it works. Awesome, so the function is working. And we can have two message variables since they're not in the same block. So to quickly summarize everything, ES6 introduces two new keywords const and let.

Variables declared with a const keyword are a reference to a constant value. You cannot redefine their values. Variables with both the const and let keyword are block scoped, which means that they're only defined within the block they're declared in and not outside of it. They're also not initialized, unlike the var keyword with a default value of undefined.

We can only access them on the lines after declaring them. Using the const and let keyword can prevent some unexpected results because of this initialization. In ES5, we only had one keyword in order to declare variables, namely var. However, in ES6, we get two extra keywords, const and let.

For example, const name equals Lydia. Variables declared with a const keyword cannot be reassigned, since the reference to their value is read only. My name is Lydia, and I'm not planning on ever changing that. So in this case, the variable name will always hold the value of the string Lydia.

Say that I somehow changed my mind and I want to change it to my second name, so name equals Julius. You can see that it throws an error because name is read only. In this case, I should have declared the variable name with a let keyword. Variables declared with a let keyword can be reassigned.

Now you might wonder why you would ever use let instead of var, since you can also re-declare variables with the var keyword. Besides a different keyword, there are more differences between const and let and the var keyword. So let's write a quick for loop that logs the current index. Here we declare the variable i.

And since we declared it with the var keyword, we can also use it outside of the for loop. So let's log the index of i outside the for loop. Now let's see what happens when we change the var keyword to the let keyword. It throws a reference error.

And this happens because variables declared with a const or let keyword are block scoped. And a block is everything between curly brackets. In this case, the curly brackets of the for loop. So the value of the variable i is only accessible within the for loop and not outside of it.

Now let's say that we have a function called checkPassword. to which we pass a password. In here, I want to check whether the password given by the user is valid, by simply checking if the length is bigger than 6. So I create a variable called valid, which is either true or false, based on whether the length of the password is bigger than 6.

length is bigger than 6. Only if the password is valid, I want to log a simple string to the console saying that the password is valid. Else if it's not valid, I want to return a string saying that password is not valid. So if valid, we declare a variable message with a string saying that your password is valid.

So const message equals your password is valid. Else if it's not valid, we declare a variable message with a string saying that your password is not valid. Now let's invoke this function and see if it works. Awesome, so the function is working.

And we can have two message variables since they're not in the same block. So to quickly summarize everything, ES6 introduces two new keywords const and let. Variables declared with a const keyword are a reference to a constant value. You cannot redefine their values.

Variables with both the const and let keyword are block scoped, which means that they're only defined within the block they're declared in and not outside of it. They're also not initialized, unlike the var keyword with a default value of undefined. We can only access them on the lines after declaring them. Using the const and let keyword can prevent some unexpected results because of this initialization.