Classes in JavaScript
A JavaScript class must contain at least one constructor. A constructor is a special method which is used to allocate the memory to the object of that class. We can only define one constructor in the class not more than one
Method in the class
We can't define more than one same name method in the class of JavaScript.
Example of class with constructor taking no argument and method sum taking two arguments.
<html>
<head>
<title>demo classes</title>
<script>
class MathsDemo
{
constructor()
{
document.write("Constructor without parameters<br>");
}
sum(n1,n2) {
this.res=n1+n2;
}
display()
{
document.write("The sum is "+this.res);
}
}//end of class
mt=new MathsDemo(); //creating class object
mt.sum(10,20); //calling method sum
mt.display(); //calling method display
</script>
</head>
<body>
</body>
</html>
Output:
The program above will display :
Constructor without parameters
The sum is 30
The sum is 30
Example of class using parameterised constructor
<html>
<head>
<title>Classes in javascript</title>
<script>
class MathsDemo
{
constructor(n1,n2)
{
this.n1=n1;
this.n2=n2;
}
sum() {
this.res=this.n1+this.n2;
}
display()
{
document.write("The sum is "+this.res);
}
}//end of class
mt=new MathsDemo(10,20); //creating class object
mt.sum(); //calling method sum
mt.display();//calling method display
</script>
</head>
<body>
</body>
</html>
Output:
The program above will display :
The sum is 30
Static methods and properties in JavaScript
Static method and property is called without creating the object of the class. It can't be called with the object of the class. We can call static method and property directly by using class name of that method and property..
Example of static method and property
<html>
<head>
<title>Static Methods and Properties in javascript</title>
<script>
class StaticExample
{
constructor()
{
//required constructor
}
static pi=3.14;
static area_Of_Circle(radius)
{
var area=this.pi*radius*radius;
document.write("The area of circle is "+area);
}
}//end of class
st=new StaticExample();
//st.area_Of_Circle(10);//undefined
StaticExample.area_Of_Circle(10);//calling static method with class name
</script>
</head>
<body>
</body>
</html>
Output:
The program above will display :
The area of circle is 314
Inheritance in JavaScript
Example of inheritance in JavaScript
<html>
<head>
<title>Inheritance in javascript</title>
<script>
class MathsDemo
{
constructor()
{
//required constructor
}
sum(n1,n2)
{
this.res=n1+n2;
document.write("The sum is "+this.res+"<br>");
}
subtract(n1,n2)
{
this.res=n1-n2;
document.write("The subtraction is "+this.res+"<br>");
}
}//end of class MathsDemo
class AdMathsDemo extends MathsDemo
{
constructor()
{
super(); //super is keyword and required to call
//required constructor
}
multiply(n1,n2)
{
this.res1=n1*n2;
document.write("The multiplication is "+this.res1+"<br>");
}
divide(n1,n2)
{
this.res1=n1/n2;
document.write("The division is "+this.res1+"<br>");
}
}//end of class AdMathsDemo
mt=new AdMathsDemo(); //creating class object
mt.sum(10,20); //calling method sum
mt.subtract(20,10); //calling method sub
mt.multiply(10,20); //calling method multiply
mt.divide(20,10); //calling method divide
</script>
</head>
<body>
</body>
</html>
Output:
The program above will display :
The sum is 30
The subtraction is 10
The multiplication is 200
The division is 2
The subtraction is 10
The multiplication is 200
The division is 2