ES6 - var let const

ES6 - var let const

ES6 JavaScript

Share

In this ES6 JavaScript tutorial we will learn to create variables using var, let and const.

The var keyword

Alright, let's begin by creating a variable using the var keyword.

Let's say we want to create a variable x and assign it a value 10. So, we will write the following line.

var x = 10;

Now, if we want to print the value of x we can console log it by writing the following line.

var x = 10;
console.log(x);

And we get the output 10.

Few important points we must note while using the var keyword to declare variables.

We can redefine the same variable x again and we will not get any error.

So, we can write something like the following.

var x = 10;
console.log(x); // 10
var x = 20;
console.log(x); // 20

This will not give us any error.

Don't do it. This leads to bugs.

This is a problem because we can redeclare the variable several times without getting any error. This will lead to bugs.

Another important thing to note about the var keyword is that it is not scoped within a block but it is globally available in the file.

For example, lets create a for loop and print from 1 to 5.

for(var x = 1; x <= 5; x++) {
  console.log('inside: ', x);
}

If we run the code we will get 1 to 5 printed. Awesome! But wait. We can access variable x even outside of the for loop even though we declared it inside the body of the loop.

So, we console log the value of x outside the loop like the following.

for(var x = 1; x <= 5; x++) {
  console.log('inside: ', x);
}
console.log('outside: ', x);

We will get the following output.

inside: 1
inside: 2
inside: 3
inside: 4
inside: 5
outside: 6

Learn more about for loop in this tutorial.

Similarly, if we declare a variable using var keyword inside the body of the loop we can access it outside the loop.

for(var x = 1; x <= 5; x++) {
  console.log('inside x: ', x);
  var y = 10;
}
console.log('outside y: ', y);

The above code will give us the following output.

inside x: 1
inside x: 2
inside x: 3
inside x: 4
inside x: 5
outside y: 10

To prevent redeclaration of variables and to make a variable block scoped we take help of the let keyword.

The let keyword

Let's create a variable x and this time use the let keyword.

let x = 10;

Now, if we want to console log the value of x we can write the following.

let x = 10;
console.log(x); // 10
Since we have declared the variable x using the let keyword so, if we again try to redeclare it we will get error.
let x = 10;
console.log(x);
let x = 20; // this will give error

Similarly, when we use the let keyword to create variables in a loop then that variable is only accessible inside the body of the loop. If we try to access it outside the body of the loop we get error.

In the following example we are creating a for loop and using the let keyword we are going to create a variable x and print value from 1 to 5. We will also declare a variable inside the body of the loop using the let keyword.

for(let x = 1; x <= 5; x++) {
  console.log('inside x: ', x);
  let y = 100;
  console.log('inside y: ', y);
}
console.log('outside x: ', x); // this will give error
console.log('outside y: ', y); // this too will give error

The const keyword

We use the ES6 const keyword to create constants. If we want a variable to have a value that never changes during the code execution then we declare it as a constant using the const keyword.

In the following example we are declaring PI as a constant.

const PI = 3.14;

Trying to reassign a new value to a constant gives error.

The following code will give error as we are trying to assign a new value to a constant variable.

const PI = 3.14;

// some lines of code...

PI = 3.14159;  // this will give error

Alright, this brings us to the end of this tutorial. Hope you enjoyed it. Don't forget to practice. And if this was helpful then do share. Thanks for reading. See you in the next tutorial. Have fun.

Share