JavaScript Prototypes and Classes Interview Questions

Here are some common interview questions about JavaScript prototypes and classes, along with their answers:

1. What is a prototype in JavaScript?

In JavaScript, every object has a property called prototype. The prototype is an object itself from which the object inherits properties and methods. When trying to access a property or method, JavaScript will first check the object itself, and if it doesn’t find it, it will look up the prototype chain until it either finds the property/method or reaches the end of the chain (null).

2. How does prototype inheritance work?

Prototype inheritance allows one object to inherit properties and methods from another. When an object is created, it can be linked to another object through its prototype. If the child object does not have the property or method, it looks for it on its prototype.

function Animal(name) {
    this.name = name;
}

Animal.prototype.speak = function() {
    console.log(`${this.name} makes a noise.`);
};

const dog = new Animal('Dog');
dog.speak(); // "Dog makes a noise."

3. What is the prototype chain?

The prototype chain is a series of links between objects and their prototypes, allowing property and method lookups. When you access a property, JavaScript checks the object first, then its prototype, and continues up the chain until it finds the property or reaches null.

4. How do you create a class in JavaScript?

In ES6 and later, we can create a class using the class keyword, which is syntactical sugar over JavaScript’s existing prototype-based inheritance.

class Animal {
    constructor(name) {
        this.name = name;
    }

    speak() {
        console.log(`${this.name} makes a noise.`);
    }
}

const dog = new Animal('Dog');
dog.speak(); // "Dog makes a noise."

5. What are class constructors and methods?

• Constructor: A special method for creating and initializing an object created with a class. It is called when an instance of the class is created.
• Methods: Functions that are defined within the class, and they can access instance properties using this.

6. What is the difference between a method defined on the class and one defined on the prototype?

When we define a method inside the class body, it is automatically added to the prototype. Both methods behave similarly, but defining methods on the prototype explicitly allows us to understand that the method will be shared among all instances.

class Animal {
    constructor(name) {
        this.name = name;
    }

    // Method defined on the prototype
    speak() {
        console.log(`${this.name} makes a noise.`);
    }
}

// Equivalent to:
Animal.prototype.speak = function() {
    console.log(`${this.name} makes a noise.`);
};

7. What is the super keyword in JavaScript classes?

The super keyword is used to call functions on an object’s parent. It can be used in the constructor of a derived class to call the parent class’s constructor, and it can also be used to access methods from the parent class.

class Animal {
    constructor(name) {
        this.name = name;
    }
}

class Dog extends Animal {
    constructor(name) {
        super(name); // Calls the parent constructor
    }

    speak() {
        console.log(`${this.name} barks.`);
    }
}

const dog = new Dog('Rex');
dog.speak(); // "Rex barks."

8. What is the purpose of Object.create()?

Object.create() is used to create a new object with the specified prototype object and properties. This method allows for more control over the prototype chain and is often used for creating objects that inherit from a specific prototype.

const animal = {
    speak() {
        console.log('Animal speaks');
    }
};

const dog = Object.create(animal);
dog.speak(); // "Animal speaks"

9. What is the difference between class and constructor functions?

• Class: Introduced in ES6, it provides a clearer syntax for creating objects and managing inheritance.
• Constructor Function: A function intended to be used with the new keyword to create instances. It uses prototypes for inheritance.

While both achieve similar results, classes are generally preferred for their readability and clarity.