Difference between var,const and let in JavaScript
Hello guys, In this post I will talk about the difference between var,const and let features used in JavaScript for variable declaration and how we can use them for coding.First we will talk about the var feature which is what most people are usually more familiar with.
VAR
Var declarations basically have 2 types of scopes.Global scope and function/local scope.If the variable is globally scoped it can be only accessed globally(cannot be accessed inside functions).If the variable is declared inside a function the variable can only be accessed from inside the function.
Now let's look at an example to understand this more clearly.
Here "object" is global scoped and "object2" is function scoped.Therefore the console output would be an error saying object is undefined.
Now that we understand the scope of Var lets look at two basic features of it.
Var variables can be re-declared and updated
Var variables can be re-declared and updated in the same scope.Lets look at two examples.
The console will give the output "bright".Therefore var variables can be re-declared without getting an error.
The console will give the output "bright".Therefore var variables can be updated without getting an error.Now lets look at a mechanism called "Hoisting" in java-script and how var behaves when hoisting is done.What hoisting actually does is before a code is executed variables and functions declarations are taken to the top of there scope.Lets look at a an example,
If you write a code like this JavaScript will automatically hoist the variable declaration to the top like this,
Also sun object will not be assign the value "bright" at the time of declaration therefore the output will be come out as "undefined".
LET
let is block scoped.A block is the code in-between 2 curly braces.
Since let is block scoped output will be given as undefined.
Var variables cannot be re-declared but can be updated
The variable sun cannot be declared again as you can see as it will give an error.
But the variable moon can be updated like above.However, the same variable can be re-declared if it is done in a different block.
Hoisting of Let
Unlike Var keyword when a let variable declaration is hoisted the variable will not be initialized as undefined.Therefore if you use a variable before its declaration you will get a reference error.
CONST
Variables declared with const maintain a constant value.Const declarations are also block scoped like let declarations and can only be accessed within the scope it was declared(within the block).
Const cannot be updated or re-declared
Every const variable must therefore be initialized at the time of declaration.But you can still update objects declared using const.
As shown above you can still update objects.
Hoisting of Const
Just like let, const variables are not initialized when hoisted.
That's it guys!!
VAR
Var declarations basically have 2 types of scopes.Global scope and function/local scope.If the variable is globally scoped it can be only accessed globally(cannot be accessed inside functions).If the variable is declared inside a function the variable can only be accessed from inside the function.
Now let's look at an example to understand this more clearly.
Here "object" is global scoped and "object2" is function scoped.Therefore the console output would be an error saying object is undefined.
Now that we understand the scope of Var lets look at two basic features of it.
Var variables can be re-declared and updated
Var variables can be re-declared and updated in the same scope.Lets look at two examples.
The console will give the output "bright".Therefore var variables can be re-declared without getting an error.
The console will give the output "bright".Therefore var variables can be updated without getting an error.Now lets look at a mechanism called "Hoisting" in java-script and how var behaves when hoisting is done.What hoisting actually does is before a code is executed variables and functions declarations are taken to the top of there scope.Lets look at a an example,
If you write a code like this JavaScript will automatically hoist the variable declaration to the top like this,
Also sun object will not be assign the value "bright" at the time of declaration therefore the output will be come out as "undefined".
LET
let is block scoped.A block is the code in-between 2 curly braces.
Since let is block scoped output will be given as undefined.
Var variables cannot be re-declared but can be updated
The variable sun cannot be declared again as you can see as it will give an error.
But the variable moon can be updated like above.However, the same variable can be re-declared if it is done in a different block.
Hoisting of Let
Unlike Var keyword when a let variable declaration is hoisted the variable will not be initialized as undefined.Therefore if you use a variable before its declaration you will get a reference error.
CONST
Variables declared with const maintain a constant value.Const declarations are also block scoped like let declarations and can only be accessed within the scope it was declared(within the block).
Const cannot be updated or re-declared
Every const variable must therefore be initialized at the time of declaration.But you can still update objects declared using const.
As shown above you can still update objects.
Hoisting of Const
Just like let, const variables are not initialized when hoisted.
That's it guys!!
Comments
Post a Comment