DEV Community

loading...
Cover image for 10 JavaScript Interview Questions

10 JavaScript Interview Questions

318097 profile image Mehul Lakhanpal Originally published at Medium ・3 min read

Note: Every question is followed by Output and a rough Explanation. Scroll at your own risk.

Q1.

var msg = "hello";

if (true) {
  var msg = "welcome";
}
console.log(msg);

// ----

let msg2 = "hello";

if (true) {
  let msg2 = "welcome";
}
console.log(msg2);
Enter fullscreen mode Exit fullscreen mode

Output

welcome
hello
Enter fullscreen mode Exit fullscreen mode

Explanation

var is function scoped, therefore, when msg is declared inside the if block, it overrides the msg in the global scope. This does not happen with let as it is block scoped.

Q2.

for (var i = 0; i < 5; i++) {
  setTimeout(function () {
    console.log(i);
  }, 1000);
}
Enter fullscreen mode Exit fullscreen mode

Output

5
5
5
5
5
Enter fullscreen mode Exit fullscreen mode

Explanation

Since var is function scoped the i variable holds the value 5 after the loop ends. The callback function in the setTimeout gets the same value for every occurrence.

Solution

  • Convert var to let to create a scope for every iteration.
for (let i = 0; i < 5; i++) {
  setTimeout(function () {
    console.log(i);
  }, 1000);
}
Enter fullscreen mode Exit fullscreen mode
  • Wrap the setTimeout in an anonymous function. Passing i as a parameter scopes it to the anonymous function and therefore the value is not lost.
for (var i = 0; i < 5; i++) {
  (function (x) {
    setTimeout(function () {
      console.log(x);
    }, 1000);
  })(i);
}
Enter fullscreen mode Exit fullscreen mode

Q3.

const obj = {
  ["foo_" + (() => 1)()]: "Hello",
};
console.log(obj);
Enter fullscreen mode Exit fullscreen mode

Output

{ foo_1: 'Hello' }
Enter fullscreen mode Exit fullscreen mode

Q4.

console.log([1,2,3] + [4,5,6]);
Enter fullscreen mode Exit fullscreen mode

Output

1,2,34,5,6
Enter fullscreen mode Exit fullscreen mode

Explanation

String([1,2,3]); is "1,2,3"

Hence, "1,2,3" + "4,5,6" is "1,2,34,5,6"

Q5. What's the order of execution?

console.log('1');
setTimeout(() => console.log('2'), 0);
Promise.resolve().then(() => console.log('3'));
console.log('4');
Enter fullscreen mode Exit fullscreen mode

Output

1
4
3
2
Enter fullscreen mode Exit fullscreen mode

Explanation

Priority for event loop is: call stack > microtask > macrotask

All the synchronous code is executed first

Therefore, logs 1, 4

Next, there is a Promise and a setTimeout

Promise callback is stored in microtask queue & setTimeout callback is stored in macrotask queue

microtask has a higher priority over macrotask. Therefore, it logs 3 followed by 2

Q6.

console.log(typeof typeof 1);
Enter fullscreen mode Exit fullscreen mode

Output

string
Enter fullscreen mode Exit fullscreen mode

Explanation

Evaluate from Right to Left

  1. typeof 1 return number
  2. typeof 'number' returns string

Q7.

console.log(Math.max() < Math.min());
Enter fullscreen mode Exit fullscreen mode

Solution

true
Enter fullscreen mode Exit fullscreen mode

Explanation

The default value for Math.max() is -Infinity & default value for Math.min() is Infinity

Hence, -Infinity < Infinity is true

Q8.

function func() {
  return foo;

  foo = 1;
  function foo() {}
  var foo = "hello";
}

console.log(typeof func());
Enter fullscreen mode Exit fullscreen mode

Output

function
Enter fullscreen mode Exit fullscreen mode

Explanation

Due to one round of parsing (hoisting) the code looks like this

function func() {
  var foo; // hoisted
  function foo() {} // hoisted
  return foo;

  foo = 1;
  foo = "hello";
}

console.log(typeof func());
Enter fullscreen mode Exit fullscreen mode

Because of that, the last value available for foo is function

Q9.

console.log(3 > 2 > 1);
Enter fullscreen mode Exit fullscreen mode

Output

false
Enter fullscreen mode Exit fullscreen mode

Explanation

It starts from left to right
so 3 > 2 equals true

true > 1 is equivalent to 1 > 1 which is false

Q10.

function fn() {
  return this.str;
}

var str = "global";

var obj = {
  str: "obj",
};

console.log(fn(), fn.call(obj));
Enter fullscreen mode Exit fullscreen mode

Output

global obj
Enter fullscreen mode Exit fullscreen mode

Explanation

When executing fn() the value of this is window and window.str is global.

.call() assigns this to obj and obj.str is obj

Note: This solution works in non-strict mode.


Thanks for reading 💙

Follow @codedrops.tech for daily posts.

InstagramTwitterFacebook

Micro-Learning ● Web Development ● Javascript ● MERN stack ● Javascript

codedrops.tech

Discussion

pic
Editor guide
Collapse
318097 profile image
Mehul Lakhanpal Author

In the second example,
The callback functions are asynchronous. Therefore, when the for loop has finished, the variable i has a value 5. And when the callback function starts to execute, at that moment it prints the value which is 5.

Collapse
aybee5 profile image
Ibrahim Abdullahi Aliyu

Hey, can you please explain no 2 more? Why will it be all 5

Collapse
olvnikon profile image
Vladimir

Let's first understand how the loop works.

for (var i = 0; i < 5; i++) {
Enter fullscreen mode Exit fullscreen mode
  1. var i = 0 - the first thing that happens
  2. i < 5 (0 < 5) is TRUE then we execute the loop
  3. i++ (i = 1 now)
  4. i < 5 (1 < 5) is TRUE then we execute the loop
  5. i++ (i = 2 now)
  6. ...
  7. i < 5 (4 < 5) is TRUE then we execute the loop
  8. i++ (i = 5 now)
  9. i < 5 (5 < 5) is FALSE then we stop executing the loop

At the end of the loop i = 5 (not 4). The loop repeated 5 times (i = 0,1,2,3,4).
When setTimeout starts to execute the function it uses the global "i", which is 5, and executes it 5 times hence you see "5" five times.

UPD: replaced "let" by "var". Copied from the wrong place. There are no issues with "let".

Collapse
dj4385 profile image
Dheeraj Sharma

👍👍👍👍👍👍

Collapse
abhiprojectz profile image
abhiprojectz

have you tried the modern github readme repo feedback system ?
dev.to/abhiprojectz/gitrate-modern...

Collapse
ajithmadhan11 profile image
Ajithmadhan

Hy! Can anyone please explain 2 more!?

Collapse
olvnikon profile image
Collapse
mohamedtebani profile image