Edit Template
  • Home
  • /
  • JS Polymorphism
Edit Template
  • Home
  • /
  • JS Polymorphism

Polymorphism

Polymorphism sounds like a complicated word, but the idea is simple: it’s about one function behaving differently based on the object it’s working with.

In JavaScript, polymorphism becomes useful when you have a common method name, but you want different objects to respond in their own way.

Real-Life Analogy

Think of the word “draw.” An artist, an architect, and a software developer all understand “draw” differently:

  • The artist draws on paper.

  • The architect draws a blueprint.

  • The developer draws graphics on the screen.

That’s polymorphismsame action, different behavior.

Polymorphism with Classes in JavaScript

Let’s take a look at a basic example where multiple classes share the same method name but perform different actions:

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

  draw() {
    console.log(`Drawing a generic shape`);
  }
}

class Circle extends Shape {
  draw() {
    console.log("Drawing a perfect circle");
  }
}

class Triangle extends Shape {
  draw() {
    console.log("Drawing a triangle with 3 sides");
  }
}

const generic = new Shape("Shape");
const round = new Circle();
const angled = new Triangle();

generic.draw();   // Output: Drawing a generic shape
round.draw();     // Output: Drawing a perfect circle
angled.draw();    // Output: Drawing a triangle with 3 sides

				
			

Even though all these objects have the same method draw(), they respond differently. This is method overriding, and it’s how JavaScript supports polymorphism.

Can JavaScript Do Function Overloading?

JavaScript doesn’t support true function overloading like some other languages (e.g., Java or C++), where you can define multiple versions of a function with different parameters.

However, you can simulate overloading by checking how many arguments were passed:

				
					function greet(name, language) {
  if (!language) {
    console.log(`Hello, ${name}!`);
  } else if (language === "fr") {
    console.log(`Bonjour, ${name}!`);
  } else if (language === "es") {
    console.log(`Hola, ${name}!`);
  } else {
    console.log(`Hello, ${name}!`);
  }
}

greet("Ali");            // Hello, Ali!
greet("Ali", "fr");      // Bonjour, Ali!
greet("Ali", "es");      // Hola, Ali!

				
			

So while JavaScript doesn’t offer true function overloading, you can build flexible functions by using conditionals and the arguments object (or rest parameters).

Why Does Polymorphism Matter?

Polymorphism helps you:

  • Reuse code: One method name can be used across many object types.

  • Simplify logic: You don’t have to write special-case code everywhere.

  • Add flexibility: You can add new behaviors later without changing existing code.

Final Thoughts

Polymorphism lets objects behave in their own way while sharing a common interface. It’s a cornerstone of clean, flexible, and extensible code. In JavaScript, you’ll use method overriding most often to achieve polymorphism, especially in class-based structures.

Scroll to Top