Cheat sheet on JavaScript interview questions
(Call Stack, Hoisting, Scope and Single Thread)
Hi guys, toady in this article we are going to see some of the frequently asked questions in JavaScript.
1. Call Stack
Call stack maintains the order of execution of execution context
When you execute a script, the JavaScript engine creates a global execution context and pushes it on bottom of the call stack.
Whenever a function is called or a new execution context is created and it is pushed inside the call stack.
Now lets understand call stack with example:
var number = 10;
function getName() {
var name = "hello world"
console.log(name);
}
getName();
2. Hoisting
Hoisting allows us to use functions and variables before they're declared.
Before hoisting I want to talk about execution context. So, in javascript everything happens inside execution context. And the code is executed in two phase-
1st phase is: memory creation phase
2nd phase is: code execution phase
So in memory creation phase javascript scans the whole code and allocates memory to variables and functions.
var and functions are stored inside global scope
let and const are stored inside different scope
Now lets continue with hoisting...
Remember 2 golden rules in hoisting:
- variable declarations are scanned and made undefined
- function declaration are scanned and made available
Variable hoisting with var
Variable declared with var
, it initializes its value to undefined because var
is stored inside global scope
Hence we can say that values defined with var
are originally in an undefined state.
console.log(myName);
var myName = "javascript";
output:
undefined
when we tried to console.log()
the variable before defining it gives us the output undefined because in JS even before the code starts executing a memory is allocated to all variables and functions, hence JS has allocated a memory of undefined
to myName
Variable hoisting with let
and const
Variables declared with let
and const
are hoisted but not initialized. Accessing a let
or const
variable before it's declared will result in a ReferenceError
because let
and const
are originally is in an uninitialized state.
console.log(myName);
let myName = "javascript"
output:
Uncaught ReferenceError: Cannot access 'myName' before initialization
when we tried to console.log()
the variable before declaring it gives us the output of Reference error because let
and const
are stored inside different scope other than global scope
Function hoisting in JavaScript
Function hoisting allows us to call a function before it is declared.
getName();
function getName() {
console.log("Hello Javascript");
}
output:
Hello Javascript
In case of function when javascript allocates memory to function it literally stores the whole function inside the global scope and that's why we are able to call function before function declaration.
3. Scope
JavaScript has 3 types of scope:
- Global scope
- Function/Local scope
- Block scope
i. Global scope
A variable declared at the top of a program or outside of a function is considered as a global scope.
Global variables can be accessed from anywhere in a JavaScript program.
Let's see an example of a global scope:
let movies = ["ironman", "superman", "spiderman"];
console.log(movies);
function movieName() {
console.log(movies);
}
movieName();
output:
Array(3) [ "ironman", "superman", "spiderman" ]
Array(3) [ "ironman", "superman", "spiderman" ]
From the above example we can conclude that variable declared in global scope can be accessed globally and it can also be accessed inside a function scope.
ii. Function scope
I will explain function scope with example:
// let
function myFunc() {
let myName = "Nikhil";
console.log(myName); // Nikhil
}
myFunc();
console.log(myName); // ReferenceError: myName is not defined
// const
function myFunc() {
const myName = "Nikhil";
console.log(myName); // Nikhil
}
myFunc();
console.log(myName); // ReferenceError: myName is not defined
// var
function myFunc() {
var myName = "Nikhil";
console.log(myName); // Nikhil
}
myFunc();
console.log(myName); // ReferenceError: myName is not defined
From the above example we can conclude that-
In variable function scope there is no difference between
let
const
andvar
.Function scope says that, whatever is defined in a function it cannot be accessed outside that function
(You can see in above example where I tried to console.log(myName) outside function and i got ReferenceError)
Remember one thing in case of var
, that var
is a function scoped it means var
has scope only and only when it is declared inside function otherwise var
does not have any scope, it can be accessed everywhere.
iii. Block scope --> { }
I will explain block scope with example:
// let
if (2 > 1 && 1 < 3) {
let result = true;
console.log(result); // true
}
console.log(result); // ReferenceError: result is not defined
// const
if (2 > 1 && 1 < 3) {
let result = true;
console.log(result); // true
}
console.log(result); // ReferenceError: result is not defined
// var
if (2 > 1 && 1 < 3) {
var result = true;
console.log(result); //true
}
console.log(result); //true
From the above example we can conclude that-
let
andconst
are not accessible outside their scope, these { } are block of code. Hence, we can say thatlet
andconst
are block scoped.But in case of
var
I can access the value even outside the block { }. Why? Remember I told you above thatvar
has scope only and only when it is declared inside function otherwisevar
does not have any scope.
Now lets talk about lexical scope
When a function has access to variables of its parents function, it is called lexical scope.
function sum(x) {
return function (y) {
return x + y;
};
}
console.log(sum(4)(6)); // 10
3. JavaScript is a synchronous, single threaded language
Single threaded means it has only one call stack that is used to execute the program. Whatever is on the top of call stack is run first.
Synchronous means in sequence, i.e. every statement of code gets executed one by one. So, basically the system has to wait for the earlier statement to get executed.