What are variables?
The variable is a container that holds some value. In other words, a variable is simply a name of storage location where the value of that variable will be stored. There are two types of variables in JavaScript: local variable and global variable. These variables can be defined using keyword var or let or const.
There are a lot of new features that came out with ES6. But wait some of you are wondering that what is ES6?.
What is ES6?
ES6 is ECMAScript's 6th edition. EcmaScript is a standard for the scripting language. It is a small update on Javascript which adds on various features.
In this blog, we are talking about one of the features of ES6 which is const and let, which can be used for variable declaration in JavaScript. But you are wondering why ES6 introduced const and let when we have var for declaring variables.
Var
var is used to declare the variables before ES6. But there are some issues(block scope issue) with variables declared with var. To resolve these issues ES6 has introduced let and const.
Scope of var
Scope is a range of variable means where these variables are available for use. var declarations are globally or locally scoped.
The scope is called global if var variable is declared outside the function. It means the variable is accessible within the whole program.
var is a function scoped when it is declared inside a function. This means that it is available and can be accessed only within that function block.
var a = 10; // globally scoped
function fun(){
var b = 20; // function scoped
}
here variable a is globally scoped as it exists outside the function whereas variable b is function scoped as it is declared within the function.
Variables declared with var can be re-declared and reinitialized.
var a = 10;
var a = 20; //redeclaration of variable a is allowed in var
Problem with var
Redeclaration and reinitialization of variables using var can cause problems when we want to access the global value of a variable. Let's understand it with an example.
var str = "hello"; // globally scoped
function fun(){
var str = "hey"; //function scoped
}
console.log(str); //it gives hey on console
the problem in the above code is that we can not access the global value of var str as it is redeclared in the function scope. That's why let and const are introduced.
Let
let is also used to declare variables and it resolves the problem of scope which we have encountered in var.
let is block scoped
Block is nothing but part of code that is enclosed within two curly braces {}.
let variables are only accessible within the block.
let a = 5; //globally scoped
function name(){
let a = 50
let b = 40; //function scoped
}
console.log(a); // 5
console.log(b); // b is not defined
In the above code, if we can not access variable b outside its scope. And also when we access variable a outside function scope it will take only global value.
let variables can be updated but not re-declared.
let a = 10;
a = 50; //it is allowed as variable is only updated not re-declared.
let a = 20; // error: Identifier 'greeting' has already been declared
function scope(){
let a = 30; //it is allowed because variable a is now block scoped.
}
Const
As its name suggests that variables declared with const maintain a constant value. const declaration is the same as let declaration as both are block scoped. That means they can only be accessible within the blocks they were declared. The only difference in const is that like let they can not be updated throughout the program.
const PI = 3.14;
PI = 3.0; //error: Assignment to constant variable.
const PI = 3.5; //error: Identifier PI has already been declared