Post
Ask Question

Creating An Object With Methods In Java Script/CSS

Introduction

 
"Everything" in JavaScript is an Object may be a String, a Number, an Array, a Date...In JavaScript, an object is a data, with properties and methods.
 
In real life, object can be a bike. The features of the bike include a name, model, weight, color, etc. But now here we discuss creating an object with methods
 
Now I will give you an example showing you how to create methods for your objects. As an example, I will create a circle as my object. The methods will be
  1. circle_name.area() {  
  2.      return the area of circle(pi * r2)  
  3. }  
  4. circle_name.circumfrrence() {  
  5.      return the circumference of circle(2 * pi * r)  
  6. } 
The complete code for the web page which consists a creation an object with methods in java script as follows
  1. <!DOCTYPE html>  
  2. <html>  
  3. <body>  
  4.  <script>  
  5.      function circle(x, y, r)  
  6.      {  
  7.         this.xcoord = x;  
  8.         this.ycoord = y;  
  9.         this.radius = r;  
  10.         this.circleArea = getArea;  
  11.         this.retCirc = function ()  
  12.         {  
  13.             return (Math.PI * this.radius * 2);  
  14.         };  
  15.         this.mvBy = mvCclBy;  
  16.     }  
  17.     function getArea()  
  18.     {  
  19.         return (Math.PI * this.radius * this.radius);  
  20.     }  
  21.     function mvCclBy(xDis, yDis)  
  22.     {  
  23.         this.xcoord += xDis;  
  24.         this.ycoord += yDis;  
  25.     }  
  26.      var testcircle = new circle(3, 4, 5);  
  27.      testcircle.mvBy(2, 3);  
  28.      window.alert('The area of the circle is ' + testcircle.circleArea());  
  29.     window.alert('The circumference is ' + testcircle.retCirc());  
  30. </script>  
  31.  </body>  
  32. </html> 
Output
 
After running the above code we'll find the following output
 
Clipboard02.jpg
 
The next output will be
 
im.jpg
Next Recommended Reading Creating a Stylish Pure CSS Loader for Your Web Application