JavaScript Interview Coding Questions — 1

Online coding is a crucial part of software developer job interviews. In this article, I will try to add several coding questions. These will be evaluation focused code snippets instead of task based coding questions. Additionally, I will share online code links at the end of every question.

Let’s start with one of the most well-known one:

1. In this question, closure and asynchronous code handling knowledge is assessed.

// What will be the console log of the code below?
for (var i = 0; i < 4; i++) {
  setTimeout(() => console.log(i), 0);
}

It will write 4, 4, 4, 4 in console because setTimeout() is a asynchronous function and it will be executed after for cycle is completed.i is defined outside scope of for loop and it will be equal to 4 when console.log() starts to write.
How can you fix it to write 0, 1, 2, 3? Here is the possible solutions:

// Solution 1:
for (let i = 0; i < 4; i++) {
  setTimeout(() => console.log(i), 0);
}
// Solution 2:
for (var i = 0; i < 4; i++) {
  (function (i) {
    setTimeout(() => console.log(i), 0);
  })(i);
}

Solution 1: You can change declaration of i from var to let because let is block scoped variable but var is function scoped variable.
Solution 2: You can wrap setTimeout() with a function to limit the scope of i variable. But you should pass i as parameter to your IIFE (Immediately-invoked Function Expression).

You can test it via this link.

2. This one is about scope of this.

// What will be the logs in console?
function nameLogger() {
  this.name = 'halil';
  console.log('first:', this.name);
}
console.log('second:', this.name);
nameLogger();
console.log('third:', this.name);

Console output will be following:

second: undefined
first: halil
third: halil

While “second” is executed this.name is undefined but after nameLogger() function is executed it will be defined. Because this refers to the global object in a function. So the others log halil as expected.
!! It will not work with 'use strict' because in a function, in strict mode, this equalsundefined instead of global object.

You can test it via this link.

3. The last one is about this and bind

// What will be written?
const module = {
  x: 55,
  getX: function () {
    console.log('x:', this.x);
  }
};
const unboundX = module.getX;
unboundX();

Console output will be x: undefined because this refers to current owner object. So when you assign only getX method to a new object unboundX , this refers to it. And it has nox property, that’s why this.x equals to undefined.
You can fix it by using bind() as below:

const boundX = unboundX.bind(module);
boundX();

Now you bind module object to unboundX function. Then it can reach the x property of module.

You can test it via this link.

My some other articles:

1. JavaScript Interview Coding Questions — 2
2. Chrome DevTool Tips