Variables are containers for storing data. There are three main ways of declaring javascript variables

• Var keyword

• Let keyword

• const keyword

var x = 10;
let y = 11;
const z = 15;

The let and const keywords are new ways of declaring javascript variables which were added to javascript in the es6(2015) update. We are going to take an in-depth look at their various features and different characteristics.

Var Keyword

The var keyword is the first keyword used in declaring javascript variables. It declares a function-scoped or global-scoped variable. features of var variables include

• Var variables can be redeclared and updated. Redeclaring and updating a variable involves assigning a variable to a new value. This is possible when using a var keyword to declare a variable and it doesn't throw an error.

    var x = 20;
    var x = 18;
    console.log(x)//This gives 18
  
    var y = 20;
    y = 19;
    console.log(y)//This gives 19
  

• Var variables when declared are hoisted to the top of their scope and initialized with a value of undefined. Hoisting involves the movement of variables and functions declaration to the top of their scope before the execution of code. It makes some types of variables accessible/usable in the code before being declared.

console.log(x)
var x = 20;//This gives an undefined

• Var variables are not block-scoped. for a better understanding of scoping visit https://codemaster17.hashnode.dev/javascript-scope

Let Keyword

The let keyword was introduced in the es6(2015) update. Let is more preferred during variable declaration as it is an improvement to the var keyword. It declares a block-scoped variable. features of the let variables include:

• Let variables can be updated but not redeclared. it gives an error when redeclared

//Redeclaring a let variable
let x = 20;
let x = 24;
//This gives an error saying that x has been declared

//Updating a let variable
let y = 24;
y = 40;
console.log(y)// This gives 40 in the console

• If you try using a let keyword before initialization, you get an error. variables declared with let are hoisted to the top of their scope but uninitialized. it gives an error.

console.log(x)
let x = 20; //This gives an error

• Variable declared with let is only available for use in that block as they are block scoped. A block is a code bounded by {}. Example

let x = 4;
let y = 5;

   if (x > 3) {
        let z = 15;
        console.log(z);//This gives 15
    }
   console.log(z) // hello is not defined

We see that using z declared outside its block gives an error.

Const Keyword

Const was also introduced in the es2016(2015) update. It also declares a block-scoped variable and its variables maintain a constant value. Its features include

• Variables declared with const cannot be updated and redeclared. It remains the same within its scope

const x = 15;
x = 15;//This gives an error

const y = 24;
const y = 5; //This also gives an error

• So just like let variables, variables declared with const are hoisted to the top but not initialized

console.log(x)
const x = 7; // This gives an error

Conclusion

Variables declared with let and const have similar characteristics and are different from variables declared with var in all aspects. This wraps it up, I hope u gained a basic understanding of the const, let and var javascript keywords, If yes let me know in the comment section. Thank you for reading 😊