JavaScript Interview Coding Questions — 5

In this article, I will add questions about JavaScript Classes. Let’s begin:

1. This one is about converting constructor function to class. It is a beneficial coding exercise to understand JavaScript class knowledge.

// Rewrite the following constructor function as a Class
function Animal(name) {
  this.name = name;
}
Animal.prototype.duck = function () {
  console.log(this.name, 'duck');
};
const animal = new Animal('daffy');
animal.duck();

The answer will be below:

// The answer is below
class Animal {
  constructor(name) {
    this.name = name;
  }
  duck() {
    console.log(this.name, 'duck');
  }
}
const animal = new Animal('daffy'); // new keyword is mandatory
animal.duck();

And one more related question after converting to class.

// 3. What will be the following console output?
console.log(typeof Animal);

The answer is:

function

You can test it via this link.

2. This one is about differences in declaration of class and functions.

// 1. What will be the output?
const car = new Car('Clio');
function Car(model) {
  this.model = model;
}
Car.prototype.getModel = function () {
  return this.model;
};
console.log('car model:', car.getModel());
// 2. What will be the output?
const bike = new Bike('Bianchi');
class Bike {
  constructor(model) {
    this.model = model;
  }
  getModel() {
    return this.model;
  }
}
console.log('bike model:', bike.getModel());

The console output will be below:

car model: Clio
ReferenceError: Bike is not defined

function definitions are hoisted so we can create an instance before declaration. However, class definitions are not initialized until their definition is evaluated so it gives ReferenceError. You can read this stackoverflow answer for more detailed information.

You can test it via this link.

3. Next question is about inheritance in JavaScript classes.

// 1. What will be the console outputs?
class Parent {
  constructor(name) {
    this.name = name;
  }
  getName() {
    return this.name;
  }
}
class Child extends Parent {
  constructor(name) {
    super(name);
  }
  getMessage() {
    return `My name is ${super.getName()}`;
  }
}
const child = new Child('Halil');

console.log(child.getMessage());
console.log(child.getName());

The outputs will be as below:

My name is Halil
Halil

So, although there is no getName() method in Child class it is inherited from Parent class.

You can test it via this link.

4. Write a generator function which takes an array and returns its every member in each call. The answer can be as below:

function* sendNumber(list) {
  for (let item of list) {
    yield item;
  }
}
const iterator = sendNumber([1, 2, 3]);
// What will be written?
console.log(iterator.next());
// What will be written?
console.log(iterator.next());
// What will be written?
console.log(iterator.next());
// What will be written?
console.log(iterator.next());

And the console outputs will be:

{ value: 1, done: false }
{ value: 2, done: false }
{ value: 3, done: false }
{ value: undefined, done: true }

You can test it via this link.

You can read the previous articles of this series from the links below:

1. JavaScript Interview Coding Questions — 1
2. JavaScript Interview Coding Questions — 2
3. JavaScript Interview Coding Questions — 3
4. JavaScript Interview Coding Questions — 4