This content originally appeared on Bits and Pieces - Medium and was authored by Aman
The short answer
Var
1. Function Scoped
2. Allows duplicate identifiers
3. Value can be updated
4. Hoisted and initialized with undefined.
Let
1. Block Scoped
2. Does NOT allow duplicate identifiers
3. Value can be updated
4. Hoisted BUT error if we try to access before declaration
Const
1. Block Scoped
2. Does NOT allow duplicate identifiers
3. Value cannot be updated
4. Hoisted BUT error if we try to access before declaration
The long answer
There are 3 ways to declare variables in JavaScript: var, let and const. Here are the key differences between var, let and const.
- Var declarations are function scoped. Let and Const are block scoped. Function scope is created by declaring a function. Block scope is created by if statements, for loops, while loops etc. Let’s understand this with an example.
In the above example, we have a function isLoggedIn with some variable declarations within the body of the function. The variable declarations ‘friend’, ‘isLoyal’, and ‘pi’ are declared within the body of the function and may be used anywhere within the function isLoggedIn. When we try to access these variables outside of the function body as we tried on lines 17, 18, and 19, we receive a ReferenceError. This is because all variable declarations within a function are only accessible within the scope of that function.
But when we introduce a block scope within our function as we did on line 7 and declare the variables “name”, “age”, and “sex”. We are able to access only the variable declared with var outside of the if statement(block scope). Hence, var declarations are function scoped. And let and const are block scoped.
In this example, we have 2 for loops in the global scope. In the top for loop, since the variable ‘i’ is declared with var, ‘i’ is accessible in the global scope after the for loop is finished running. This is why we get 10 outside the scope of the for loop.
This means that if a variable is declared using var anywhere besides a function, it will always exist in the global scope.
In our second for loop, because ‘j’ is declared with let, we are unable to access ‘j’ outside of the for loop.
2. Var allows duplicate identifiers. Let and Const do not allow duplicate identifiers.
Variables with var can be re-declared. But doing the same with a let or const will lead to a SyntaxError.
3. Values declared with Var and Let variables can be re-assigned. Values declared with const variables cannot be re-assigned.
In the above example, we are able to change the value of a variable declared with var and let but not with const.
4. Var declarations are hoisted and initialized with undefined. Let and Const are hoisted but not initialized with undefined.
Variable identifiers are hoisted AND initially are set to undefined. This is why the answer variable will display as undefined in the Add function.
In the Subtract and Multiply functions, Let and Const declarations are hoisted BUT we would get an error because we cannot access answer before declaration.
This is because of a Temporal Dead Zone (TDZ) for let and const declarations. The Temporal Dead Zone is a time window where a variable exists but is still uninitialized. And because this variable is uninitialized , it is unaccessible.
Build composable applications
Don’t build web monoliths. Use Bit to create and compose decoupled software components — in your favorite frameworks like React or Node. Build scalable and modular applications with a powerful and enjoyable dev experience.
Bring your team to Bit Cloud to host and collaborate on components together, and greatly speed up, scale, and standardize development as a team. Start with composable frontends like a Design System or Micro Frontends, or explore the composable backend. Give it a try →
Learn More
- How We Build Micro Frontends
- How we Build a Component Design System
- The Composable Enterprise: A Guide
- 7 Tools for Faster Frontend Development in 2022
JavaScript Interview Question: Describe the Difference Between Var vs Let vs Const was originally published in Bits and Pieces on Medium, where people are continuing the conversation by highlighting and responding to this story.
This content originally appeared on Bits and Pieces - Medium and was authored by Aman
Aman | Sciencx (2022-03-23T08:57:00+00:00) JavaScript Interview Question: Describe the Difference Between Var vs Let vs Const. Retrieved from https://www.scien.cx/2022/03/23/javascript-interview-question-describe-the-difference-between-var-vs-let-vs-const/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.