Skip to main content

JavaScript OOP Unveiled: Prototypes, Classes & Inheritance

JavaScript OOP Unveiled: Prototypes, Classes & Inheritance

 Object-Oriented Programming (OOP) in JavaScript is based on prototypes rather than classical class-based inheritance. However, with ES6, JavaScript introduced the class syntax, making OOP more structured. Here are some commonly asked OOP interview questions in JavaScript.



Basic OOP Concepts

  1. What are the four principles of Object-Oriented Programming?

    • Encapsulation
    • Abstraction
    • Inheritance
    • Polymorphism
  2. How does JavaScript implement OOP?

    • JavaScript uses prototype-based inheritance rather than class-based inheritance. However, ES6 introduced the class keyword, which provides syntactic sugar over prototypes.
  3. What is a constructor function in JavaScript?

    • A constructor function is a function used to create objects. Example:
      js
      function Person(name, age) { this.name = name; this.age = age; } let person1 = new Person("John", 30);
  4. What is the difference between a class and a constructor function?

    • class is syntactic sugar over a constructor function.
    • Example using a class:
      js
      class Person { constructor(name, age) { this.name = name; this.age = age; } } let person1 = new Person("John", 30);

Encapsulation & Abstraction

  1. How do you implement encapsulation in JavaScript?

    • Encapsulation can be achieved using private properties (# prefix in ES6).
      js
      class BankAccount { #balance; // Private property constructor(initialBalance) { this.#balance = initialBalance; } getBalance() { return this.#balance; } } let account = new BankAccount(1000); console.log(account.getBalance()); // 1000
  2. What is abstraction in JavaScript?

    • Abstraction is hiding implementation details and only exposing essential functionalities.
    • Example:
      js
      class Car { startEngine() {console.log("Engine started"); } } let myCar = new Car(); myCar.startEngine(); // Hides actual engine logic

Inheritance

  1. How does inheritance work in JavaScript?

    • JavaScript allows inheritance using extends and super.
    • Example:
      js
      class Animal { constructor(name) { this.name = name; } makeSound() { console.log("Some sound"); } } class Dog extends Animal { makeSound() { console.log("Bark"); } } let myDog = new Dog("Buddy"); myDog.makeSound(); // Bark
  2. What is the difference between classical and prototypal inheritance?

    • Classical inheritance (as in Java, C#) uses classes.
    • Prototypal inheritance (used in JavaScript) links objects to prototypes.

Polymorphism

  1. How does JavaScript support polymorphism?
    • JavaScript supports polymorphism by method overriding.
    • Example:
      js
      class Bird { speak() { console.log("Tweet!"); } } class Parrot extends Bird { speak() { console.log("Hello!"); } } let myParrot = new Parrot(); myParrot.speak(); // Hello!

Prototype & this Keyword

  1. What is a prototype in JavaScript?

    • A prototype is an object from which other objects inherit properties.
    • Example:
      js
      function Person(name) { this.name = name; } Person.prototype.greet = function () { console.log("Hello, " + this.name); }; let p = new Person("John"); p.greet(); // Hello, John
  2. What is the difference between __proto__ and prototype?

    • prototype is a property of constructor functions.
    • __proto__ is a property of objects referring to their prototype.
  3. What does the this keyword refer to in JavaScript?

    • this refers to the context in which a function is executed.
    • Example:
      js
      class Test { constructor(name) { this.name = name; } printName() { console.log(this.name); } } let obj = new Test("Alice"); obj.printName(); // Alice

Miscellaneous

  1. What is method overriding?

    • Subclass provides a new implementation for an inherited method.
  2. How does JavaScript handle multiple inheritance?

    • JavaScript does not support multiple inheritance directly but allows multiple prototypes using mixins.
  3. What is the difference between shallow copy and deep copy in JavaScript?

    • Shallow copy: Copies only references (e.g., Object.assign).
    • Deep copy: Copies all nested properties (e.g., JSON.parse(JSON.stringify(obj)) or structured cloning API).