What is the difference between Var and Const in JavaScript?

Hey, learners. Today we will see the difference between the keywords var, and const.

As a beginner, it is common to get confused with the available options of doing something related but using different keywords.

Today we will see the options available in JavaScript for declaring variables. The latest version of JavaScript, ES6, has given us many new features and, one such feature is the addition of keywords ‘const’ to the variable declaration in addition to the ‘var’ keyword.

The main difference is in the scope of a variable and its usage.

The scope of a variable is the area of the variable where the definition is valid and can be accessed. Consider this example.

var name = "CodeWithRandom"//can be accessed anywhere in the program
function fun(){
var myname="AneeshMalapaka" //valid only in the function.
console.log("inside the function")
console.log(name) //outputs CodeWithRandom
console.log(myname)
}
fun() //function calling
console.log("outside the function")
console.log(name) //outputs CodeWithRandom
console.log(myname) //gives error: myname is not defined as it is only available in function fun()

Ecommerce Website Using HTML, CSS, & JavaScript (Source Code)

var:

The var keyword has global scope if declared outside a function and local if inside a function.  The problem with var is its value can be modified in conditional blocks but not in functions.

Consider this example:

var name="John Doe"  
 console.log(name) //prints John Doe

if(true){
var name="Johnny Depp"
}

console.log(name) //changes the value of name to Johnny Depp

//lets do same in function
var msg="Hello, World."
console.log(msg) //returns Hello, World.

function fun(){

var msg="Hi, World."
console.log(msg) //returns Hi, World.

}
fun()
console.log(msg) //returns Hello, World.

We can notice here that in the “if block” if a new variable is declared it can be accessed outside too and, sometimes this could be a problem as it is modified. 

const:

Now the const keyword in JavaScript is similar to the const keyword in other languages. It is used to declare constant values and cannot be updated or declared twice.

Let’s understand with an example.

 const age = 16   
 console.log(age) //retuns 16

//lets try modifying it.
console.log("Legal age for driving is 18")
age+=2
console.log(age) //returns error: Assignment to constant variable.

//lets try redeclaring it.
const age = 18
console.log(age) //returns error: Identifier 'age' has already been declared

In conclusion, the var keyword is globally scoped or locally scoped in the case of functions and other blocks but it cannot be accessed from a function. 

Portfolio Website Using HTML CSS And JAVASCRIPT ( Source Code)

const has global scope outside and is locally scoped inside a block of code and, used for constant values. There is a way to update its values by declaring it as an object. Consider this example.

 const ageInfo ={  
   age:16  
 }  
 console.log(ageInfo.age) //retuns 16

//lets try modifying it.

ageInfo={
age:18
} //cannot modify like this as it give assignment arror
console.log("Your age now is: "+ageInfo.age)

ageInfo.age=18
console.log("Your age now is: "+ageInfo.age) //return the age value to be 18

//here we are modifying the properties of the ageInfo object
//rather than the const object itself.

I hope that the difference between the var and const keywords and when to use them is understood clearly.

100+ JavaScript Projects With Source Code ( Beginners to Advanced)

As a beginner, we choose var mostly but it is efficient, and recommended to change it according to the situation.

Happy Coding. 🙂

Written by: Aneesh Malapaka