This article is about a few important topics of Javascript which are must-asked in interviews.
1. Scope
Scope of variables in Javascript refers to the accessibility of variables within a program.
Types of scope:
Note: Before ES6, Javascript only had Global Scope and Function Scope
Block Scope
let
andconst
keywords provide Block Scope in Javascript. Variables declared inside a { } block cannot be accessed outside the block. This is called block scope.
{
const x=5;
let d=6;
}
// x cannot be accessed here
// d cannot be accessed here
Local Scope
Variables declared within a function have its accessibility only within the function. It cannot be used or accessed outside the function. This is called local scope.
// m cannot be accessed here
function vehicle(){
var m="car";
// m can only be accessed here
}
// m cannot be accessed here
Function Scope
All local variables within a function have function scope. Variables declared withvar
,let
,const
within a function, all have function scope i.e, they cannot be accessed from anywhere outside the function.
function fruit(){
var a="apple";
let b="banana";
const c="pineapple";
// a b and c can only be accessed here
}
Global Scope
Variables declared usingvar
,let
orconst
can have global scope when they are declared outside any function or block. These variables can be accessed globally (everywhere within the program).
var x=2;
let y=3;
const z=4;
function say(){
// x,y,z can be accessed here
}
// x,y,z can be accessed here
2. Javascript Call Stack
The Call Stack in Javascript is used to keep track of multiple function calls by the Last In First Out (LIFO) principle. Also, Javascript engine uses Call Stack to manage Execution Contexts (Global Execution Context and Function Execution Context). Lets understand how it works with the help of an example:
function animal() {
check();
}
function check() {
return "dog";
}
animal();
When the JavaScript engine executes this script, the global execution context is placed in the call stack.
Then the javascript engine creates a function execution context and places the called function animal() in top of the stack.
The animal() function calls check() function. So, the JavaScript engine creates another function execution context for check() function and places the check() function on top of the call stack.
Now Javascript executes the check() function first since it is on the top of the stack and pops it out of the stack. So, now this is how call stack looks:
Next Javascript executes the animal() function and pops it out of the call stack.
Execution stops as call stack became empty.
So that's how the call stack works.
3. Javascript is a Single Threaded language
Javascript is a single threaded language means it has one call stack and one memory heap. Javascript executes one single task at a time before moving to the next task. JavaScript is a single-threaded language, which means it has only one call stack that is used to execute the program.
For example:
function first(){
for(i=1;i<=5;i++)
{
console.log(i);
}
}
function second(){
console.log("hello world");
}
first(); // first() will be executed, completed
second(); //then only second() will be executed.
4.Hoisting
Hoisting in JavaScript is the behavior by which the declaration of variables with var
keyword and functions are moved to the top. This means that the variable or function declaration need not be done before initializing and calling them.
console.log(x);
var x; //undefined
Variable Hoisting
Just like var
, let
and const
declarations are hoisted to the top but unlike var
which is initialized as undefined, the let
and const
keyword is not initialized. So if you try to use a let
variable before declaration, you'll get a Reference Error.
a=4;
console.log(a);
let a; // Reference error
Function Hoisting
Function declarations hoist the function definitions. Hence, functions declaration can be used before they are declared.
say(); // This function is hoisted
function say(){
console.log("This function is hoisted");
}
Well that's all from my side. Happy coding!