Unlike any other programming languages in JavaScript, polymorphism provides an ability to call the same method on different JavaScript objects. As JavaScript is not a type-safe language, we can pass any type of data members with the methods.
Why Polymorphism?
- Imagine you have a universal remote control. You press the “power” button, and it turns on your TV. You press the same “power” button, and it adjusts the volume on your sound system.
- Similarly, in JavaScript, polymorphism allows you to use the same method or function name in different objects, and each object can perform its unique action.
Flexibility and Reusability:
- With your universal remote, you don’t need a different remote for each device. You can use one remote for various electronics.
- In JavaScript, polymorphism provides flexibility. You can write functions or methods that can work with different types of objects, making your code more reusable.
Let’s see an example where a child class object invokes the parent class method.
the code demonstrates a simple example of class inheritance in JavaScript. Class B extends class A, and an instance of class B is created to invoke the display method inherited from class A.
<script>
class A
{
display()
{
document.writeln("A is invoked");
}
}
class B extends A
{
}
var b=new B();
b.display();
</script> Output :
A is invokedExplanation of the above source code in detail:
The provided code is JavaScript and defines two classes, A and B, with class B extending class A. It then creates an instance of class B and invokes the display method.
Let’s Break down:
This opening <script> tag indicates the start of a JavaScript block within an HTML document.
class A
{
display()
{
document.writeln("A is invoked");
}
}Here, a class named A is defined. It has a method called display which, when called, writes the string “A is invoked” to the document using document.writeln.
class B extends A
{
}
This line defines a class named B that extends (inherits from) class A. It means that B inherits the properties and methods of class A. In this case, B doesn’t have its own display method but inherits it from A.
var b = new B();
This line creates an instance of class B and assigns it to the variable b. The new keyword is used to instantiate an object based on the class B.
b.display();This line calls the display method on the instance of class B. Since class B doesn’t have its own display method, it inherits it from class A. As a result, “A is invoked” is written to the document. At the last the script is closed with closing tag.
To make polymorphism more clear lets see other example below
where a child and parent class contains the same method. Here, the object of child class invokes both classes method.
<script>
class A
{
display()
{
document.writeln("A is invoked<br>");
}
}
class B extends A
{
display()
{
document.writeln("B is invoked");
}
}
var a=[new A(), new B()]
a.forEach(function(msg)
{
msg.display();
});
</script> A is invoked
B is invokedThis JavaScript code defines two classes, A and B, with class B extending class A. It then creates an array a containing instances of both classes and uses the forEach method to iterate over the array and call the display method on each instance. Here’s a breakdown of each part:
class A
{
display()
{
document.writeln("A is invoked<br>");
}
}
Here, a class named A is defined with a method display. When display is called, it writes “A is invoked” followed by a line break to the document.
class B extends A
{
display()
{
document.writeln("B is invoked");
}
}This line defines a class named B that extends (inherits from) class A. It overrides the display method of class A to write “B is invoked” to the document instead.
var a = [new A(), new B()];
This line creates an array a containing two instances, one of class A and one of class B. The instances are created using the new keyword.
a.forEach(function(msg)
{
msg.display();
});The forEach method is used to iterate over each element in the array a. For each element (msg), the display method is called. Since the instances are of different classes (A and B), the behavior of the display method is determined by the class of each instance.
When the code runs, the output will be:
A is invoked
B is invoked
This is because the display method of class A is invoked for the first instance, and the overridden display method of class B is invoked for the second instance.
polymorphism in JavaScript provides a way to write code that can work with different objects in a consistent and flexible manner. It makes your code more adaptable, reusable, and easier to understand, just like a universal remote control for various devices.
Leave a Reply