Before we start
π Before we start this article i would like to clarify some technical jargons for you
π Scope : Scope is nothing but a code block where the variable is accessible for usage
π Global Scope : Global Scope means variable is declared globally (not in some condition or function) hence it can be used any where throughout the execution of program
π Local/ Functional Scope : this simply means that when we declare a variable on function level or somewhere locally in code block then it's not accessible outside of that particular scope (imagine variables declared in functions , loops ,conditionals...)
π Block Scope : Blocks are nothing but piece of code written inside any curly braces {...} [ex. if block , or function's block]
Var
π Var is the oldest way of declaring variable
π Var can be globally and functionally scoped
π If we Declare var inside function it becomes functionally scoped if we declare it outside function it becomes globally scoped and is available anywhere in program
π can be redeclared or updated
πExample of Scope
var a = 10; // global variable
function fun()
{
// functional scoped variable
var b = 20;
console.log(a);
console.log(b);
}
fun();
console.log(a);
console.log(b);
π output
-> inside function
10 β
20 β
-> outside function
10 β
uncaught reference : b is not defined β
π Notice that functions can access both global and functional variables.
π Example of Re-declaration
// variables with var can be re-decalred β
var a = 10;
var a = 20;
// you won't get any error
π Example of updatable variables
// variables with var can be updated β
var a =10;
a=20;
// you won't get any error
π Problems with var
π Redefining variables won't throw any errors which means it's tricky to remember which variable is already there and which variable is new.
Let
π Let is the modern way of declaring variables introduces in ES2015
π Let is now recommended way of declaring variables
π Let is block scoped
π Let can be updated but not redeclared
πExample of Declaration
// let can be updated β
let a = 30; β
a = 40; β
// but not redeclared β
let b = 40; β
let b = 90 ;β
// error : Identifier 'b' has already been declared
πExample of block scope
let sayHi = "hi";
if(sayHi === "hi")
{
let newMsg = "how are you?";
console.log(sayHi); // outputs "hi"
}
console.log(sayHi); β
console.log(newMsg); β // 'newMsg is not defined'
Const
π Variables declared with const
remains same throughout the execution
π variables declared with const
are not redeclarable or updatable
π if const
variables declared outside any block they becomes global scoped , but if they are declared within block they becomes block scoped
π values can not be changes or new values can not be assigned to const
variables
π Example:
const sayHi = "hi";
const sayHi = "hello"; β // will throw error
//and ...
const msg = "buy bread from market";
msg = "new msg here"; β // error: assignment to constant variable.
π But...
const numbers = [1,2,3];
number[0] = 4; β // works fine
// but...
numbers = [5,6,7]; β // won't work
π the first case will work because we're within the rules , we're not redeclaring the const variable nor we're updating it. but we're mutating it. π
Summary
π var: Global/function scoped depending on declaration undefined when accessing a variable before it's declared. can be redeclared and updated.
π let: block scoped. can be updated but we can't redeclare.
πconst: block scoped. can not be reassigned nor we can redeclare.
Let me know in comment section if you have any doubt or feedback. it's always worth to give time to the thriving developer community :)
Keep Coding β€
Top comments (10)
I've been doing software professionally for several years now and I honestly cannot think of a single real-world case where I've ever had to use
var
or any case wherevar
could possibly have been better in any way. Basicallyvar
s only use is forconst
andlet
to be compiled to it for Internet Explorer support πI totally agree, I don't use
var
, but this is for beginners so it's beneficial to compare :)Definitely agree. Just pointing it out.
Is there any reason to use
var
?Everything I've been taught (only in the last ~1 month, I'm new) has focused on
let
andconst
just saw your comment after posting mine
I totally agree, I don't use
var
, but this is for beginners so it's beneficial to compare :)Definitely agree. Just pointing it out.
Hey,
In the Var section of "Example of Re-declaration",
Did you mean:
?
Or did you mean what you wrote:
?
Do feel to correct me if I am wrong.
Hey you're right, it was typo - fixed it
Thanks
Glad I could help.