2025 JS Abstraction and Polymorphism

Introduction

JavaScript is a widely used programming language that supports Object-Oriented Programming (OOP) principles, making code more efficient and maintainable.

Two key OOP concepts in JavaScript are Abstraction and Polymorphism. Abstraction helps in simplifying complex systems by hiding unnecessary details and exposing only the relevant parts, making the code cleaner and easier to use.

On the other hand, Polymorphism allows the same function or method to behave differently based on the object it is used with, improving flexibility and code reusability. These concepts help developers build scalable applications with well-structured code.

JavaScript Polymorphism: A Complete Guide with Examples

Introduction

JavaScript is a powerful, object-oriented programming language that supports key OOP principles, including polymorphism. Polymorphism is a fundamental concept that allows objects to be treated as instances of their parent class while maintaining their own unique behavior. This enables developers to write flexible and reusable code, making programs more scalable and maintainable.

What is Polymorphism?

Polymorphism comes from the Greek words “poly” (many) and “morph” (forms), meaning “many forms.” In programming, polymorphism allows a method or function to perform different tasks based on the object that calls it.

For example, a method named speak() may behave differently for different objects, such as a Dog barking and a Cat meowing.

Simple Example of Polymorphism in JavaScript

class Animal {
    speak() {
        console.log("This animal makes a sound.");
    }
}

class Dog extends Animal {
    speak() {
        console.log("The dog barks.");
    }
}

class Cat extends Animal {
    speak() {
        console.log("The cat meows.");
    }
}

const animals = [new Dog(), new Cat(), new Animal()];

animals.forEach(animal => {
    animal.speak();
});

Output:

The dog barks.  
The cat meows.  
This animal makes a sound.  

Here, the speak() method behaves differently based on the object calling it, demonstrating method overriding, a key form of polymorphism.

Types of Polymorphism in JavaScript

JavaScript supports two main types of polymorphism:

1. Method Overriding (Runtime Polymorphism)

Method overriding occurs when a child class redefines a method inherited from its parent class to provide a specific implementation.

Example of Method Overriding

class Vehicle {
    start() {
        console.log("The vehicle is starting.");
    }
}

class Car extends Vehicle {
    start() {
        console.log("The car engine starts with a key.");
    }
}

class Bike extends Vehicle {
    start() {
        console.log("The bike starts with a self-start button.");
    }
}

const myCar = new Car();
const myBike = new Bike();

myCar.start(); // Output: The car engine starts with a key.
myBike.start(); // Output: The bike starts with a self-start button.

Here, both Car and Bike classes override the start() method of the Vehicle class, demonstrating runtime polymorphism.

2. Method Overloading (Compile-Time Polymorphism – Not Natively Supported in JavaScript)

Method overloading allows multiple functions with the same name but different parameters. However, JavaScript does not support method overloading natively like Java or C++. Instead, we can achieve a similar effect using default parameters, arguments object, or rest parameters.

Example of Simulated Method Overloading in JavaScript

class MathOperations {
    add(a, b, c = 0) {
        return a + b + c;
    }
}

const calc = new MathOperations();

console.log(calc.add(2, 3));      // Output: 5
console.log(calc.add(2, 3, 4));   // Output: 9

Here, we simulate method overloading by using a default parameter (c = 0), allowing different numbers of arguments to be passed.

Real-Life Example of Polymorphism in JavaScript

Imagine we are building a payment processing system where different payment methods (Credit Card, PayPal, and Bitcoin) need to implement their own version of a processPayment() method.

class Payment {
    processPayment() {
        console.log("Processing payment...");
    }
}

class CreditCard extends Payment {
    processPayment() {
        console.log("Processing payment via Credit Card.");
    }
}

class PayPal extends Payment {
    processPayment() {
        console.log("Processing payment via PayPal.");
    }
}

class Bitcoin extends Payment {
    processPayment() {
        console.log("Processing payment via Bitcoin.");
    }
}

const payments = [new CreditCard(), new PayPal(), new Bitcoin()];

payments.forEach(payment => {
    payment.processPayment();
});

Output:

Processing payment via Credit Card.  
Processing payment via PayPal.  
Processing payment via Bitcoin.  

This demonstrates how polymorphism allows different payment methods to define their own behavior while sharing a common interface.

Advantages of Polymorphism in JavaScript

1. Code Reusability – The same method can work for multiple object types, reducing code duplication.
2. Flexibility – Objects can be substituted easily without modifying existing code.
3. Improved Maintainability – Centralized logic in parent classes makes updates easier.
4. Better Scalability – New object types can be added without changing existing logic.

Disadvantages of Polymorphism in JavaScript

1. Performance Overhead – Method lookup in the prototype chain can slow down execution.
2. Increased Complexity – Managing multiple levels of method overrides can be challenging.
3. Unintended Behavior – If not handled correctly, method overriding may lead to unexpected results.

FAQs on JavaScript Polymorphism

JavaScript Abstraction: A Complete Guide with Examples

Introduction

In object-oriented programming (OOP), abstraction is a fundamental concept that helps developers simplify complex systems by hiding unnecessary details and exposing only essential functionalities. In JavaScript, abstraction allows us to create clean, modular, and reusable code by defining abstract structures that focus on what an object should do rather than how it does it.

What is Abstraction in JavaScript?

Abstraction is the process of hiding implementation details and exposing only the necessary parts of an object or function. This helps in reducing complexity and improving code readability.

Think of a car:

• As a driver, you only need to know how to start, stop, and accelerate the car.
• You don’t need to understand how the engine, battery, and fuel system work internally.

Similarly, in JavaScript, abstraction allows us to define interfaces (functions and methods) that the user interacts with, while hiding the internal logic.

How to Achieve Abstraction in JavaScript?

JavaScript does not have a built-in keyword for abstraction like abstract classes in Java or C++, but we can achieve abstraction using:

1. Abstract Classes (Using ES6 Classes and Methods)
2. Private Methods and Properties (Encapsulation)
3. Using Factory Functions

1. Abstraction Using Classes and Methods

We can create an abstract class in JavaScript by defining a base class that has common methods but does not provide an implementation for all of them. The child classes must then implement those methods.

Example of Abstract Class in JavaScript

class Animal {
    constructor(name) {
        if (this.constructor === Animal) {
            throw new Error("Abstract classes cannot be instantiated.");
        }
        this.name = name;
    }

    makeSound() {
        throw new Error("Method 'makeSound()' must be implemented.");
    }

    move() {
        console.log(`${this.name} is moving.`);
    }
}

class Dog extends Animal {
    makeSound() {
        console.log("Woof! Woof!");
    }
}

class Cat extends Animal {
    makeSound() {
        console.log("Meow! Meow!");
    }
}

const dog = new Dog("Buddy");
dog.makeSound(); // Output: Woof! Woof!
dog.move();      // Output: Buddy is moving.

const cat = new Cat("Whiskers");
cat.makeSound(); // Output: Meow! Meow!
cat.move();      // Output: Whiskers is moving.

Explanation:

• The Animal class is abstract, meaning it cannot be instantiated directly.
• The makeSound() method is not implemented in the Animal class, forcing subclasses (Dog and Cat) to provide their own implementations.
• The move() method is implemented in the parent class and can be used by all child classes.

2. Abstraction Using Private Methods and Properties

With ES6 (ECMAScript 2015) and later versions, JavaScript introduced private properties and methods using the # symbol. This ensures that certain details remain hidden from the user.

Example of Private Properties in JavaScript

class BankAccount {
    #balance; // Private property

    constructor(accountHolder, balance) {
        this.accountHolder = accountHolder;
        this.#balance = balance; // Only accessible inside the class
    }

    deposit(amount) {
        if (amount > 0) {
            this.#balance += amount;
            console.log(`Deposited $${amount}. New balance: $${this.#balance}`);
        } else {
            console.log("Deposit amount must be greater than zero.");
        }
    }

    withdraw(amount) {
        if (amount > 0 && amount <= this.#balance) {
            this.#balance -= amount;
            console.log(`Withdrawn $${amount}. Remaining balance: $${this.#balance}`);
        } else {
            console.log("Insufficient funds or invalid amount.");
        }
    }

    checkBalance() {
        console.log(`Balance: $${this.#balance}`);
    }
}

const myAccount = new BankAccount("Alice", 500);
myAccount.deposit(200);  // Output: Deposited $200. New balance: $700
myAccount.withdraw(100); // Output: Withdrawn $100. Remaining balance: $600
myAccount.checkBalance(); // Output: Balance: $600

console.log(myAccount.#balance); // Error: Private field '#balance' must be declared in an enclosing class

Explanation:

• The #balance property is private, meaning it cannot be accessed directly from outside the class.
• The deposit(), withdraw(), and checkBalance() methods provide a controlled way to interact with the account balance.
• Direct access to #balance results in an error, enforcing abstraction.

3. Abstraction Using Factory Functions

A factory function is a function that creates objects without using a class. We can use closures to hide private data.

Example of Abstraction Using Factory Function

function createCar(brand, model) {
    let fuel = 100; // Private variable

    return {
        brand,
        model,
        drive: function() {
            if (fuel > 0) {
                fuel -= 10;
                console.log(`${brand} ${model} is driving. Fuel left: ${fuel}%`);
            } else {
                console.log(`${brand} ${model} has no fuel.`);
            }
        },
        refuel: function() {
            fuel = 100;
            console.log(`${brand} ${model} has been refueled.`);
        }
    };
}

const myCar = createCar("Toyota", "Corolla");
myCar.drive();  // Output: Toyota Corolla is driving. Fuel left: 90%
myCar.drive();  // Output: Toyota Corolla is driving. Fuel left: 80%
myCar.refuel(); // Output: Toyota Corolla has been refueled.

console.log(myCar.fuel); // Output: undefined (Fuel is private)

Explanation:

• The fuel variable is private because it is defined inside the function and cannot be accessed directly from outside.
• The drive() and refuel() methods allow controlled interaction with the private data.

Advantages of Abstraction in JavaScript

1. Reduces Complexity – Hides unnecessary details and focuses on essential functionalities.
2. Improves Code Maintainability – Developers can update internal implementations without affecting the external interface.
3. Enhances Security – Private methods and properties prevent direct access to sensitive data.
4. Encourages Reusability – Abstract structures allow multiple implementations in different contexts.

FAQs on JavaScript Abstraction

2025 JS Abstraction and Polymorphism – Summary

JavaScript Abstraction and Polymorphism are essential OOP principles that enhance code efficiency and readability. Abstraction focuses on hiding complex details and exposing only necessary functionality, ensuring a clear and simplified interface.

Polymorphism allows different objects to use the same method in different ways, making the code more flexible and reusable. By implementing these concepts effectively, developers can write more structured, maintainable, and scalable JavaScript applications.

JavaScript Encapsulation and Inheritance: Understanding Key OOP Concepts with Examples