Friday, March 29, 2024
HomeJavaDistinction between let, var, and const variables in JavaScript? Instance Tutorial

Distinction between let, var, and const variables in JavaScript? Instance Tutorial


Good day guys, if you wish to perceive the distinction between var, let, and const in JavaScript then you might have come to the appropriate place. Earlier, I’ve shared the perfect 

and when to make use of them. They’re three alternative ways to declare variables in JavaScript. The var is the traditional and outdated solution to declare variables in JavaScript and it might declare each native and international variables, whereas let and const are new methods to declare variables in Java and so they have block scope, I imply they’re solely seen within the block they’re declared. let is used to declare native variables whereas const is mostly used to declare constants, I imply variable whose worth does not change as soon as initialized. 

JavaScript got here out within the mid-90s and since then, it has come a good distance. It was by no means meant to be what it’s as we speak. It was created in simply 10 days. So clearly it had many flaws. Through the years, outdated options of the language have been eliminated or up to date whereas new ones are added infrequently.

The key adjustments in JavaScript had been made within the yr 2015 when the sixth version of the ECMA-262 customary got here out. It was often known as ES2015 or ES6. This model added main options to the language whereas up to date the older ones. 

ES6 added two new key phrases – let and const – for declaring variables. This straightforward but highly effective new characteristic may be very helpful in fashionable programming. However JavaScript already has the var key phrase for declaring variables. 

The introduction of let and const didn’t take away the var key phrase from JavaScript. All three can be utilized however all of them are totally different. On this article, we’ll talk about what’s the distinction between these three key phrases. 

What are Scope of var, let, and const variables in JavaScript

The scope is the key distinction between these three key phrases. Earlier than discussing the distinction, let’s perceive what scope really is.

Each time a variable is said, it’s assigned a scope. The scope would be the “space” the place the variable will be accessed or used. In easy phrases, the scope defines the supply of the variable within the code. There are two sorts of scope in JavaScript – World and Native. 

What is the difference between var, let, and const in JavaScript? Example Tutorial

1. Scope of var

A variable declared with var can have international or native scope, relying on the place it’s declared. If a variable is said exterior the operate, then it has a world scope. This implies the variable will be accessed wherever within the window. The scope adjustments when the variable is said utilizing var inside a operate. Now, the variable can solely be accessed contained in the operate, not exterior it. 

Observe the next instance:

var sayHi = "Hello...";

operate demo() {	
  console.log(sayHi + "contained in the operate");
}

console.log(sayHi + "exterior the operate")
 
demo();

Within the above code, “sayHi” is said exterior the operate. So it has a world scope. It’s accessed inside in addition to exterior the operate. When the code is executed, the output is:

Due to its international scope, “sayHi” is accessible inside in addition to exterior the operate. Now observe the next code.

operate demo() {

  var sayHi = "Hello...";
	
  console.log(sayHi + "contained in the operate");
}
 
demo();

console.log(sayHi + "exterior the operate")

This time, “sayHi” is said contained in the operate. When the code is executed, the console assertion contained in the operate works correctly however it is going to throw an error when the console assertion exterior the operate is encountered. It should throw the next error:

It occurs as a result of “sayHi” has an area scope. 

2. Scope of let and const

Each let and const has block scope. Block scope is the scope throughout the curly brackets. However when declared exterior the curly brackets, the variables declared with let and const behave because the variables declared with the var key phrase. 

Observe the next code:

if(true)
{	
  let sayHi = "Hello...";
	
  console.log(sayHi + "contained in the block");
}

When the above code is executed, the output is: 

Now, observe the next code.

if(true)
{	
  let sayHi = "Hello...";	
}

console.log(sayHi + "exterior the block");

The above code will throw an error when executed as a result of “sayHi” is accessed exterior the block. Equally, the variables declared with the const key phrase have block scope.

2. Updating and re-declaring Variables

It isn’t needed {that a} variable as soon as declared with a worth is not going to be up to date once more. Really, in actual observe, it’s fairly frequent to reassign a brand new worth to an already declared variable. Equally, re-declaring a variable can be attainable. Let’s examine how varlet, and const are totally different in updating and re-declaring. 

2,1 Updating and re-declaring in var

Each updating and re-declaring are attainable with variables declared with var key phrases. Observe the next code. 

Within the above code, the variable “sayHi” is said with a worth. Within the subsequent line, it’s up to date with a brand new attainable. The code will run with none error. Equally, the next state of affairs can be attainable. 

var sayHi = "Hello...";

var sayHi = "Hello... How are you?";

Within the above code, “sayHi” is said two instances utilizing the var key phrase. 

2.2 Updating and re-declaring with let

Like var, variable declared with let can be up to date. Observe the next code.

let sayHi = "Hello...";

sayHi = "Hello... How are you?";

The above code will work however with let, re-declaring isn’t attainable. 

let sayHi = "Hello...";

let sayHi = "Hello... How are you?";

The above code will throw an error. 

2.3 Updating and re-declaring with const

The variable declared with const can’t be up to date. So the next code is not going to work. 

const sayHi = ;

sayHi = ;

The worth of a variable declared with const can’t be modified. Furthermore, the variables declared with const can’t be re-declared. 

const sayHi = ;

const sayHi = ;

The above code will throw an error. 

So the key distinction between var, let, and const is the scope. Whereas the var can have a world in addition to practical scope (relying on the state of affairs), the let and const have block scopes. One other distinction is in updating the values and re-declaring the variables. 

The variables declared with var will be up to date and re-declaring whereas variables declared with let will be up to date however can’t be re-declared. Within the case of const, the variable can’t be up to date or re-declared. 



RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Most Popular

Recent Comments