Javascript Interview Question and Answer - 3

In this post, I have discussed 5 basic javascript question and answer that is mostly asked in the interviews. Most of the time interviewer starts the interview with some of these basic questions.
So here we have

Q1. What is the difference between == and ===?

Solution : When we want to test the equality of two values(LHS and RHS), we use == or ===.
== is basically used to check if the two values are equal or not,and we are not considering their datatype. e.g.
if we check

5 == "5"   // true as values are equal
undefined = null   //  true as both represents NO VALUE

In case of ===, we not only consider the values but the datatype as well.e.g.

5 === "5"   // false as though values are equal but datatypes are different

Similarly

undefined === null  //  false, as datatype of undefined and null is undefined and object respectively

It is highly recommended to use === in the programming as we get very unexpected results out of ==. e.g.

false == 0   // true
false == "false"   // false
0 == ""  //  true
"0" == "" // false

Q2. What will be the output of the following code snippet?

console.log(1);
setTimeout( () => console.log(2),1000);
setTimeout( () => console.log(3), 0);
setTimeout( () => console.log(4), 0);
console.log(5);

Solution : We will get
1
5
3
4
2
Since console.log are simple calls we get 1 and 5. The moment JS engine see setTimeout function, it will put them in event stack.
And once it is done with the execution of the main function, it will bring back these setTimeout from the stack. Now wince console.log for 3 and 4 has time 0, we get 3 and 4 after 1 and 5, and after a second it will print 2 as well.
Learn about arrow function.

Q3. What will be the output of the following code snippet?

for(var i = 0 ; i < 10 ; i++){
    setTimeout( () => console.log(i), 1000)
}

Solution : We might be expecting result from 0 to 9, but we will actually get 10 printed 10 times.
The reason is during the loop execution the setTimeout will be put to event stack and once the for loop end, all the setTimeout will be executed with the current value of i, i.e. 10 because the last value of i was 10 when loop ended.
We can avoid this issue by using ECMAS6 let instead of var in for loop.

Q4. What will be the output of the following code snippet?

var a = 5;
var hello = () => {
       console.log(a);   // ?
       var a = 10;
}
hello();

Soltion: It will log undefined in the console. It will not take the value 5 from the global scope, since it has a variable with same name in its local scope. It will not give error because of hoisting. It won't log 10 since assignment is after the console.log. Check hoisting article.

Q5. What will be the output of the following code snippet?

let a = [1,2,3];
let b = a;
b.push(4);
console.log(b);
console.log(a);

Solution: for b it will log [1,2,3,4] and for a as well it will log [1,2,3,4] because array are referenced type. Any changes on either of the array will reflect on other.

We can avoid this by doing the assignment of one array to other using spread operator( case in ECMAS 6). i.e.

let a = [1,2,3];
let b = [...a];
b.push(4);
console.log(b);    // [1,2,3,4]
console.log(a);    // [1,2,3]

Thank you!!