Example to illustrate Polymorphism using JavaScript

To illustrate Polymorphism using JavaScript we define a base object called Automobile with attributes and behaviors. Then we create sub object called Mercedes and Porshce to share the Automobiles attributes and behaviors.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head> 
<title>JavaScript - Polymorphism Example</title> 
</head> 
 
<body> 
<p> 
  <script language="JavaScript" type="text/JavaScript"> 
 
	function Automobile(speed)
	{
   // ************************************************************************
   // PUBLIC PROPERTY -- ANYONE MAY READ/WRITE
   // ************************************************************************
   		this.model = "Standard";
 
   // ************************************************************************
   // PRIVATE VARIABLE AND FUNCTION
   // ONLY PRIVELEGED METHODS MAY VIEW/EDIT/INVOKE
   // ***********************************************************************
		var drivingSpeed = speed;
		var milePerGallonValue1 = 0;
		var milePerGallonValue2 = 0;
 
 
   // ************************************************************************
   // PRIVILEGED METHODS
   // MAY BE INVOKED PUBLICLY AND MAY ACCESS PRIVATE ITEMS
   // MAY NOT BE CHANGED; MAY BE REPLACED WITH PUBLIC FLAVORS
   // ************************************************************************
 
		this.setMilePerGallonEquation = function(param1, param2)
		{
			milePerGallonValue1 = param1;
			milePerGallonValue2 = param2;
		}
 
		this.getMilePerGallonEquation = function()
		{
			return milePerGallonValue1 * milePerGallonValue2;
		}
 
		this.getBaseMilesPerGallon = function()
		{
		   return Math.round(  drivingSpeed / this.getMilePerGallonEquation() );
		}
 
		this.setBaseSpeed = function(newSpeed)
		{
		   drivingSpeed = newSpeed;
		}
 
		this.getBaseSpeed = function()
		{
		   return drivingSpeed;
		}
 
 
	}
 
 
	// ************************************************************************
	// PROTOTYOPE PROERTIES -- ANYONE MAY READ/WRITE (but may be overridden)
	// ************************************************************************
	Automobile.prototype.tankSize = 13;
 
 
	// ************************************************************************
	// STATIC PROPERTIES -- ANYONE MAY READ/WRITE
	// ************************************************************************
	Automobile.opinion = "";
 
 
	// ************************************************************************
	// PUBLIC METHODS -- ANYONE MAY READ/WRITE
	// ************************************************************************
	Automobile.prototype.setIdealSpeed = function(ideal)
	{
		this.idealSpeed = ideal;
	}
 
	Automobile.prototype.getIdealSpeed = function()
	{
		return this.idealSpeed;
	}
 
 
	Mercedes.prototype = new Automobile();
	function Mercedes(autoMobile)
	{
		this.setBaseSpeed( autoMobile.getBaseSpeed() );
	}
 
	Porsche.prototype = new Automobile();
	function Porsche(autoMobile)
	{
		this.setBaseSpeed( autoMobile.getBaseSpeed() );
	}
 
 
	 function performTest()
	 {
		autoMobileObject = new Array(3)
		autoMobileObject[0]  = new Automobile(50);
		autoMobileObject[1] = new Mercedes( autoMobileObject[0] );
		autoMobileObject[2] = new Porsche( autoMobileObject[0] );
 
		autoMobileObject[0].setMilePerGallonEquation(.015, 100);
		autoMobileObject[1].setMilePerGallonEquation(.03, 100);
		autoMobileObject[2].setMilePerGallonEquation(.02, 100);
 
 
		alert("At " + autoMobileObject[0].getBaseSpeed() + " mph. the " + autoMobileObject[0].model +  " version of my Automobile with a " + autoMobileObject[0].tankSize  + " gallon tank will get " + autoMobileObject[0].getBaseMilesPerGallon() + " miles per gallon." );
 
 
	// ******************************************************************************************************************
	// CREATE A TEST TO EVALUATE THE BEST MILES PER GALLON FOR A BASIC AUTOMOBILE
	// ******************************************************************************************************************
		if( autoMobileObject[0].getBaseMilesPerGallon() >= 30 )
		{
			Automobile.opinion = "That's pretty good!";
		}
		else
		{
			Automobile.opinion = "That's not good";
		}
 
		alert( Automobile.opinion );
 
 
 
		alert("At " + autoMobileObject[1].getBaseSpeed() + " mph. the " + autoMobileObject[1].model +  " version of my Mercedes with a " + autoMobileObject[1].tankSize  + " gallon tank will get " + autoMobileObject[1].getBaseMilesPerGallon() + " miles per gallon." );
 
 
	// ********************************************************************************************************
	// CREATE A TEST TO EVALUATE THE BEST MILES PER GALLON FOR A MERCEDES
	// *********************************************************************************************************
		if( autoMobileObject[1].getBaseMilesPerGallon() >= 30 )
		{
			Automobile.opinion = "That's pretty good!";
		}
		else
		{
			Automobile.opinion = "That's not good";
		}
 
		alert( Automobile.opinion );
 
 
		alert("At " + autoMobileObject[2].getBaseSpeed() + " mph. the " + autoMobileObject[2].model +  " version of my Porsche with a " + autoMobileObject[2].tankSize  + " gallon tank will get " + autoMobileObject[2].getBaseMilesPerGallon() + " miles per gallon." );
 
 
	// ******************************************************************************************************
	// CREATE A TEST TO EVALUATE THE BEST MILES PER GALLON FOR A PORSCHE
	// ******************************************************************************************************
		if( autoMobileObject[0].getBaseMilesPerGallon() >= 30 )
		{
			Automobile.opinion = "That's pretty good!";
		}
		else
		{
			Automobile.opinion = "That's not good";
		}
 
		alert( Automobile.opinion );
 
 
	// ************************************************************************************************************
	// CHANGE THE IDEAL SPEED USING PUBLIC PROPERTIES AND PRIVILEGED METHODS
	// ************************************************************************************************************
		autoMobileObject[0].setIdealSpeed(65);
 
		alert("For best performance the ideal speed is around " +  autoMobileObject[0].getIdealSpeed() + " mph." );
 
		autoMobileObject[0].model = "Luxury";
		autoMobileObject[0].tankSize = 20;
		autoMobileObject[0].setBaseSpeed(70);
 
		alert("However, at " + autoMobileObject[0].getBaseSpeed() + " mph. the " + autoMobileObject[0].model +  " version of my Automobile with a " + autoMobileObject[0].tankSize  + " gallon tank will get " + autoMobileObject[0].getBaseMilesPerGallon() + " miles per gallon." );
 
		if( autoMobileObject[0].getBaseMilesPerGallon() >= 30 )
		{
			Automobile.opinion = "That's pretty good!";
		}
		else
		{
			Automobile.opinion = "That's not good";
		}
 
		alert( Automobile.opinion );
 
 
	 }
 
</script> 
 
</p> 
<p align="center"><font size="+3" face="Arial, Helvetica, sans-serif">Polymorphism
  Example</font></p> 
<p align="center">&nbsp;</p> 
<form name="form1" method="post" action=""> 
  <div align="center"> 
 
    <!-- Add button to call JavaScript function --> 
    <input type="button" name="peformTest" value="Perform Test" onclick="javascript:performTest()"> 
 
  </div> 
</form> 
</body> 
</html>
Share Article/Example:
  • Facebook
  • Twitter
  • del.icio.us
  • Digg
  • DotNetKicks
  • DZone