- Trending Categories
Data Structure
Networking
RDBMS
Operating System
Java
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Static methods in JavaScript classes?
This article discusses about the static methods in JavaScript classes with suitable exmaplein JavaScript.
The “static” is a keyword that is used for a class, method, or a property. Static method is a method that is directly a member of a class rather than a part of instance of class.
Using a static method, we can invoke a method directly from a class, instead of creating an instance of a class. A class can have any number of static methods and static variables.
Let’s understand this concept better with the help of suitable examples further in this aricle.
Syntax
The syntax for static method is −
Static methodName(){};
Example 1
This is an example program to illustrate the invoking of static and non-static methods.
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Static methods in JavaScript classes</title> </head> <body style="text-align: center;"> <p>Static methods in JavaScript classes</p> <p id="static"></p> <script> class Sample { static show1() { return "static method is invoked"; } show2() { return "non-static method is invoked"; } } var obj = new Sample(); document.getElementById('static').innerHTML = Sample.show1()+"<br/>"+obj.show2(); </script> </body> </html>
On executing the above code, the below output is generated.
Example 2
This is an example program to show how more than one static method works with same name and same parameters.
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Static methods in JavaScript classes</title> </head> <body style="text-align: center;"> <p>Static methods in JavaScript classes</p> <p id="static"></p> <script> class Sample { static show1(a,b) { return 'Addition is performed : '+(a+b); } static show1(a,b){ return "Multiplication is performed : "+(a*b); } } document.getElementById('static').innerHTML = Sample.show1(10,20); </script> </body> </html>
On executing the above code, the below output is generated.
Example 3
This is an example program to invoke a static method inside a non-static method.
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Static methods in JavaScript classes</title> </head> <body style="text-align: center;"> <p>Static methods in JavaScript classes</p> <p id="static"></p> <script> class Sample { static example1() { return "Referring to a static method."; } example2() { return Sample.example1(); } } var sample1 = new Sample(); document.getElementById('static').innerHTML = sample1.example2(); </script> </body> </html>
On executing the above code, the below output is generated.
Example 4
This is an example program on how more than one static method can be invoked and how a static method can be called within another static method.
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Static methods in JavaScript classes</title> </head> <body style="text-align: center;"> <p>Static methods in JavaScript classes</p> <p>Illustration of how more than one static methods can be invoked and how a static method can be called within another static method.</p> <p id="static"></p> <script> //A static method or property can be called within another method using "this" property class Sample { static display1() { return "static method 1 is invoked"; } static display2() { return "static method 2 is invoked"; } static display3() { return this.display2()+" is a function from another static function"; } } document.getElementById('static').innerHTML = Sample.display1()+"<br/>"+Sample.display2()+"<br/>"+Sample.display3(); </script> </body> </html>
On executing the above code, the below output is generated.
- Related Articles
- Static Nested Classes in Java
- What is the difference between static classes and non-static inner classes in Java?
- Static methods vs Instance methods in Java
- How to assign static methods to a class in JavaScript?
- Are static methods inherited in Java?
- Java 8 static methods in interfaces
- PHP Static Properties and Methods
- Kotlin static methods and variables
- Shadowing of static methods in Java\n
- Passing static methods as arguments in PHP
- Can I overload static methods in Java?
- Can interfaces have Static methods in Java?
- Restrictions applied to Java static methods
- Why can’t we override static methods in Java?
- What are static methods in a Python class?
