Javascript Interview Questions
Q1. What is Function Declarations?
-Also called Function definition, Function statement.
:- Just a normal function:
function squire(num){
return num * num;
}
Q2. What is Function Expression?
:- function expression are assign to a variable.
const squire = function (num) {
return num * num;
}
Q3. What is anonymous Function?
:- Function that has no name
function (num) {
return num * num;
}
Q4. What are First Class Functions?
:- Where a function can be treated like a variable their functions are called first class functions. In these cases function can be passed into another function. Can be use manipulated and return from those functions. And basically everything that a variable can do a function can also do. this is why we called function as first class function in JavaScript.
function squire(num){
return num * num;
}
function displaySquire(fn){
console.log("Squire is " + fn(5));
}
//Calling display function and
//squire function as a variable
displaySquire(squire)
=====================
//Outpur: Squire is 25
Q5. What is IIFE?
Immediately invoked function expressions
:- in this case we can wrap a function into a parenthesis and call immediately
(function squire(num){
console.log(num * num)
})(5);
//==============
//Output: 25
//-----------------------------------
A tricky code example:
(function (x) {
return (function (y) {
console.log(x);
})(2)
})(1);
===============
//Output: 1
//Why this is not undefined?
//because of javascript closures
Q6. What is JavaScript Scope?
What is the output of the code below?
for (let i=0; i<5; i++){
setTimeout(function(){
console.log(i);
}, i * 1000);
}
====================
//Output: 0, 1, 2, 3, 4
//Because 'let' have block scope
but for code below:
for (var i=0; i<5; i++){
setTimeout(function(){
console.log(i);
}, i * 1000);
}
====================
//Output: 4, 4. 4, 4. 4
//Because 'var' doesn't have block scope
Q7. What is Function Hoisting?
Hoisting works differently in case of Functions. if we declare a variable it hoisted as undefined and only when we assign a variable then it get's it's value. But for function. Function get hoisted as fully declared. That is why we can call function before or after defining it.
Example:
squire(5)
function squire(num){
console.log(num * num)
}
// Output : 25
=================
//But for variable
console.log(x)
x = 10
// Output: Undefined
Q8. Interesting Hoisting Question
what will be the output of below code?
var x = 21
var fun = function(){
console.log(x);
var x = 20;
};
fun();
// you may think the output should be 21 as console log called before local x variable, so it should print out global variable value.
// But it will print undefined.
// Because Hoisting is a two step process.
// First it initialized global scope and then it will also initialize local scope as well.
// It will hoiest x in local scope as undefined.
So, when we have a variable in a scope. we will not going to check global scope.
Q9: Params vs Arguments ?
function squire(num){ // this is params
console.log(num * num);
}
squire(5); // This is Argument
// Wehen we pass a value it's argument.
Q10: Javascript Rest vs Spread operator
function multiply(...nums) { // This is Rest Operator ...nums
console.log(nums[0] * nums[1]);
}
var arr = [5, 6]
multiply(...arr) // here ...arr is Spread operator
Q11: What will be the output of below code?
const fn = (a, ...numbers, x, y) => {
console.log(x, y)
};
fn(5,6,3,7,8,9,10)
// Output: Error - Rest parameter must be last formal parameter
// let's write it in correct way
const fn = (a, x, y), ...numbers, => {
console.log(x, y)
};
fn(5,6,3,7,8,9,10)
//output: 6, 3, [7,8,9,10]
Q12: What is a callback function?
A callback functiion is a function passed into another function as an arguments, which is then invoked inside the outer function to complete some kind of routine or action.
Here is a quick example:
function greeting(name) {
alert(`Hello, ${name}`);
}
function processUserInput(callback) {
const name = prompt("Please enter your name.");
callback(name);
}
processUserInput(greeting);
Q13: What is Arrow functions?
// Normal function
const add = function(firstNum, secondNum){
return firstNum + secondNum;
};
// Arrow function
const add = (firstNum, secondNum) => {
return firstNum + secondNum;
};
// Just removed function keyword and added arrow sign
// and even we can remove return keyword like below
const add = (firstNum, secondNum) => firstNum + secondNum;
//**We can't use arguments inside arrow function**
function fn() {
console.log(arguments);
}
fn(1,2,3)
// Output: [1, 2, 3]
// but if we tries to write like this
const fnArr = () => {
console.log(arguments);
}
// Output: arguments is not defined
// Also we can't use this keyword in arrow function like below
let user = {
username: "Himel Rana",
fn1: () => {
console.log("Welcome to " + this.username);
},
fn2(){
console.log("Welcome to " + this.username);
},
}
user.fn1();
// output: username is undefined
user.fn2();
// output: welcome to Himel Rana
Q14: What is Closures ?
A closure is the combination of a function bundled together (enclosed) with references to its surrounding state (the lexical environment). In other words, a closure gives you access to an outer function's scope from an inner function. In JavaScript, closures are created every time a function is created, at function creation time.
Laxical Scoping
Consider the following example code:
function init() {
var name = "Mozilla"; // name is a local variable created by init
function displayName() {
// displayName() is the inner function, that forms the closure
console.log(name); // use variable declared in the parent function
}
displayName();
}
init();
Closure
function makeFunc(){
var name = "Himel";
function displayName(num) {
console.log(name, num)
}
return displayName;
}
makeFunc()(5)
//Output: Himel 5
Q15: Closure Scope Chain
Every closure has three scopes:
Local scope (Own scope) Enclosing scope (can be block, function, or module scope) Global scope A common mistake is not realizing that in the case where the outer function is itself a nested function, access to the outer function's scope includes the enclosing scope of the outer function—effectively creating a chain of function scopes. To demonstrate, consider the following example code.
// global scope
const e = 10;
function sum(a) {
return function (b) {
return function (c) {
// outer functions scope
return function (d) {
// local scope
return a + b + c + d + e;
};
};
};
}
console.log(sum(1)(2)(3)(4)); // 20
Q16: What will be logged to console?
let count = 0
(function printCount(){
if(count === 0) {
let count = 1;
console.log(count) // 1
}
console.log(count) // 0
})();
17: Write a function that would allow you to do like this
var addSix = createBase(6);
addSix(10) // return 16
addSix(21) // return 27
Answer:
function createBase(num){
return function add(value){
console.log(num + value)
}
}
var addSix = createBase(6);
addSix(10) // result 16
addSix(21) // result 27