Polymorphism in JavaScript: Harnessing the Power of OOP

Greetings! In today's lesson, we'll unravel the concept of polymorphism in JavaScript's Object-Oriented Programming (OOP). Grasping polymorphism enables us to use a single entity (a method, class, or interface) to represent different types in various scenarios. Let's proceed.

Polymorphism, a pillar of OOP, allows one object to embody multiple forms. Visualize a button in software; depending on its type (for instance, a submit button or a radio button), the action resulting from pressing it varies. This dynamic encapsulates the spirit of polymorphism!

Let's observe polymorphism in action within a simple application involving shapes. The base Shape class has an area method, which calculates the area for shapes. This method is uniquely implemented in the subclasses Rectangle and Circle.

class Shape {
    area() {
        throw new Error("This method should be overridden.");
    }
}

class Rectangle extends Shape {
    constructor(length, width) {
        super();
        this.length = length;
        this.width = width;
    }

    area() {  // calculate rectangle area
        return this.length * this.width;
    }
}

class Circle extends Shape {
    constructor(radius) {
        super();
        this.radius = radius;
    }

    area() {  // calculate circle area
        return 3.14 * this.radius * this.radius;
    }
}

const rectangle = new Rectangle(2, 3);
console.log(rectangle.area()); // Prints: 6

const circle = new Circle(5);
console.log(circle.area()); // Prints: 78.5

Here, polymorphism shines as the area function takes on multiple forms and behaves differently depending on whether it's part of a Rectangle or a Circle.

Polymorphism is indispensable when dealing with inheritance, as a single action can exhibit different behaviors for different object types, streamlining the code while enhancing readability and maintainability.

JavaScript supports dynamic polymorphism through method overriding within subclasses. Unlike some other programming languages, JavaScript doesn't support static polymorphism (method overloading) in the traditional sense. However, we can achieve similar results using default parameters and type checking.

Below is an illustrative example of dynamic polymorphism using method overriding.

class Shape {
    area(length, width, radius) {
        if (radius) {  // If the radius is provided, calculate the circle area
            return 3.14 * radius * radius;
        } else if (length && width) {  // if length and width are provided, calculate the rectangle area
            return length * width;
        } else {
            return "Invalid parameters";
        }
    }
}

const shape = new Shape();
console.log(shape.area(5, 2));  // Rectangle area
console.log(shape.area(null, null, 3));  // Circle area