We now have a youtube channel. Subscribe!
Home
Javascript

JavaScript Math Methods



Hello guys! morning and welcome to a new section of my tutorial on JavaScript. Its really a great thing because i will soon be rounding up with JavaScript tutorials. In my last tutorial post, we discussed about the various JavaScript Math properties with series of examples.

So now in this tutorial, i will be discussing about the Math methods. Read through very carefully and ask your questions where necessary.

The Math abs Method

Math abs method returns the absolute value of a number.

Syntax

Its syntax is as follows -

Math.abs( x );

Parameter Details

x - A number.

Return Value

Returns the absolute value of a number.

Example

Try the following example below.

<html>
     <head>
          <title> JavaScript Math abs() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.abs( -1 );
               document.write("First Test Value :  "  +  value  +  "<br />"  );   

                var  value =  Math.abs( null );  
               document.write("Second Test Value :  "   +  value  +  "<br />" );                   

                var  value =  Math.abs( 20 ); 
               document.write("Third Test Value :  "   +  value  +  "<br />" );    

                var  value =  Math.abs("string");
               document.write("Fourth Test Value :  "  +  value );
          </script>
     </body>
</html>

Output

Below is the output of the above example.

First Test Value :  1
Second Test Value :  0
Third Test Value : 20
Fourth Test Value :  NaN 


The Math acos Method

This method returns the arccosine in radians of a number. This acos method returns a numeric value between 0 and pi radians for x between -1 and 1. If the value of number is outside of this range, it returns NaN.

Syntax

Its syntax is as follows -

Math.acos( x );

Parameter Details

x - A number.

Return Value

Returns the arccosine in radians of a number.

Example

Try the following example below.

<html>
     <head>
          <title> JavaScript Math acos() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.acos( -1 );
               document.write("First Test Value :  "  +  value  +  "<br />"  );   

                var  value =  Math.acos( null );  
               document.write("Second Test Value :  "   +  value  +  "<br />" );                   

                var  value =  Math.acos( 30 ); 
               document.write("Third Test Value :  "   +  value  +  "<br />" );    

                var  value =  Math.acos("string");
               document.write("Fourth Test Value :  "  +  value );
          </script>
     </body>
</html>

Output

Below is the output of the above example.

First Test Value :  3.141592653589793
Second Test Value :  1.5707963267948966
Third Test Value :  NaN 
Fourth Test Value :  NaN

You can also read our tutorial post on: JavaScript - Array object with examples

The Math asin Method

This method returns the arcsine in radians of a number. The asin() method returns a numeric value that is between -pi/2 and pi/2 radians for x between  -1 and 1. If the value of the number is outside this range, it returns NaN.

Syntax

Its syntax is as follows -

Math.asin( x );

Parameter Details

x - A number.

Return Value

Returns the arcsine in radians of a number.

Example

Try the following example below.

<html>
     <head>
          <title> JavaScript Math asin() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.asin( -1 );
               document.write("First Test Value :  "  +  value  +  "<br />"  );   

                var  value =  Math.asin( null );  
               document.write("Second Test Value :  "   +  value  +  "<br />" );                   

                var  value =  Math.asin( 30 ); 
               document.write("Third Test Value :  "   +  value  +  "<br />" );    

                var  value =  Math.asin("string");
               document.write("Fourth Test Value :  "  +  value );
          </script>
     </body>
</html>

Output

Below is the output of the above example.

First Test Value :  -1.5707963267948966
Second Test Value :  0
Third Test Value :  NaN 
Fourth Test Value :  NaN

The Math atan Method

This method returns the arctangent in radians of a number. The atan method returns a numeric value between -pi/2 and pi/2 radians.

Syntax

Its syntax is as follows -

Math.atan( x );

Parameter Details

x - A number.

Return Value

Returns the arctangent in radians of a number.

Example

Try the following example below.

<html>
     <head>
          <title> JavaScript Math atan() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.atan( -1 );
               document.write("First Test Value :  "  +  value  +  "<br />"  );   

                var  value =  Math.atan( .5 );  
               document.write("Second Test Value :  "   +  value  +  "<br />" );                   

                var  value =  Math.atan( 30 ); 
               document.write("Third Test Value :  "   +  value  +  "<br />" );    

                var  value =  Math.atan("string");
               document.write("Fourth Test Value :  "  +  value );
          </script>
     </body>
</html>

Output

Below is the output of the above example.

First Test Value :  -0.7853981633974483
Second Test Value :  0.4636476090008061
Third Test Value :  1.5374753309166493
Fourth Test Value :  NaN



The Math atan2 Method

The Math atan2 method returns the arctangent of the quotient of its arguments. The JavaScript Math atan2 method returns a numeric value that is  between -pi and pi representing angle theta (θ) of an (x, y)  point.

Syntax

Its syntax is as follows -

Math.atan2( x, y );

Parameter Details

x and y - Numbers.

Return Value

Returns the arctangent in radians of a number.

Math.atan2( ±0,    -0 ) returns  ±PI. 
Math.atan2( ±0,    +0 ) returns  ±0. 
Math.atan2( ±0,    -x ) returns  ±PI  for  x  <  0. 
Math.atan2( ±0,    x ) returns  ±0  for  x  >  0. 
Math.atan2( y,    ±0 ) returns  -PI/2  for  y  >  0. 
Math.atan2( ±y,    -Infinity ) returns  ±PI  for  finite  y  >  0. 
Math.atan2( ±y,    +Infinity ) returns  ±0  for  finite  y  >  0. 
Math.atan2( ±Infinity,     +x ) returns  ±PI/2  for  finite  x. 
Math.atan2( ±Infinity,     -Infinity ) returns  ±3*PI/4. 
Math.atan2( ±Infinity,     +Infinity ) returns  ±PI/4.

Example

Try the following example below.

<html>
     <head>
          <title> JavaScript Math atan2() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.atan2( 90,  15 );
               document.write("First Test Value :  "  +  value  +  "<br />"  );   

                var  value =  Math.atan2( 15,  90 );  
               document.write("Second Test Value :  "   +  value  +  "<br />" );                   

                var  value =  Math.atan2( 0,  -0 ); 
               document.write("Third Test Value :  "   +  value  +  "<br />" );    

                var  value =  Math.atan2( +infinity,  -infinity );
               document.write("Fourth Test Value :  "  +  value );
          </script>
     </body>
</html>

Output

Below is the output of the above example.

First Test Value :  1.4056476493802699
Second Test Value :  0.16514867741462683
Third Test Value :  3.141592653589793
Fourth Test Value :  2.356194490192345

The Math ceil Method

This method returns the smallest integer that is greater than or equal to a number.

Syntax

Its syntax is as follows -

Math.ceil( x );

Parameter Details

x - A number.

Return Value

Returns the smallest integer that is greater than or equal to a number.

Example

Try the following example below.

<html>
     <head>
          <title> JavaScript Math ceil() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.ceil( 45.95 );
               document.write("First Test Value :  "  +  value  +  "<br />"  );   

                var  value =  Math.ceil( 45.20 );  
               document.write("Second Test Value :  "   +  value  +  "<br />" );                   

                var  value =  Math.ceil( -45.95 ); 
               document.write("Third Test Value :  "   +  value  +  "<br />" );    

                var  value =  Math.ceil( -45.20 );
               document.write("Fourth Test Value :  "  +  value );
          </script>
     </body>
</html>

Output

Below is the output of the above example.

First Test Value :  46
Second Test Value :  46
Third Test Value :  -45
Fourth Test Value :  -45

You can also read our tutorial post on: JavaScript Syntax

The Math cos Method

This method returns the cosine of a number. The cos method returns a numeric value that is between -1 and 1, which represents the cosine of an angle.

Syntax

Its syntax is as follows -

Math.cos( x );

Parameter Details

x - A number.

Return Value

Returns the cosine of a number.

Example

Try the following example below.

<html>
     <head>
          <title> JavaScript Math cos() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.cos( 90 );
               document.write("First Test Value :  "  +  value  +  "<br />"  );   

                var  value =  Math.cos( 30 );  
               document.write("Second Test Value :  "   +  value  +  "<br />" );                   

                var  value =  Math.cos( -1 ); 
               document.write("Third Test Value :  "   +  value  +  "<br />" );    

                var  value =  Math.cos( 2*Math.PI );
               document.write("Fourth Test Value :  "  +  value );
          </script>
     </body>
</html>

Output

Below is the output of the above example.

First Test Value :  -0.4480736161291702
Second Test Value :  0.15425144988758405
Third Test Value :  0.5403023058681398
Fourth Test Value :  1


The Math exp Method

This method returns Ex, where x is the argument and E is Euler's constant, the base of the natural logarithm.

Syntax

Its syntax is as follows -

Math.exp( x );

Parameter Details

x - A number.

Return Value

Returns the exponential value of the variable x

Example

Try the following example below.

<html>
     <head>
          <title> JavaScript Math exp() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.exp( 1 );
               document.write("First Test Value :  "  +  value  +  "<br />"  );   

                var  value =  Math.exp( 30 );  
               document.write("Second Test Value :  "   +  value  +  "<br />" );                   

                var  value =  Math.exp( -1 ); 
               document.write("Third Test Value :  "   +  value  +  "<br />" );    

                var  value =  Math.exp( .5 );
               document.write("Fourth Test Value :  "  +  value );
          </script>
     </body>
</html>

Output

Below is the output of the above example.

First Test Value :  2.718281828459045
Second Test Value :  10686474581524.482
Third Test Value :  0.3678794411714424
Fourth Test Value :  1.6487212707001282

You can also read our tutorial post on: How to add JavaScript to Html(JavaScript placement)

The Math floor Method

This method returns the largest integer that is greater than or equal to a number.

Syntax

Its syntax is as follows -

Math.floor( x );

Parameter Details

x - A number.

Return Value

Returns the largest integer that is greater than or equal to a number.

Example

Try the following example below.

<html>
     <head>
          <title> JavaScript Math floor() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.floor( 10.3 );
               document.write("First Test Value :  "  +  value  +  "<br />"  );   

                var  value =  Math.floor( 30.9 );  
               document.write("Second Test Value :  "   +  value  +  "<br />" );                   

                var  value =  Math.floor( -2.9 ); 
               document.write("Third Test Value :  "   +  value  +  "<br />" );    

                var  value =  Math.floor( -2.2 );
               document.write("Fourth Test Value :  "  +  value );
          </script>
     </body>
</html>

Output

Below is the output of the above example.

First Test Value :  10
Second Test Value :  30
Third Test Value :  -3
Fourth Test Value :  -3


The Math log Method

This method returns the natural logarithm (Base E) of a number. If the value of the number is not positive, that is if negative, the return value will always be NaN. 

Syntax

Its syntax is as follows -

Math.log( x );

Parameter Details

x - A number.

Return Value

Returns the natural logarithm of a number.

Example

Try the following example below.

<html>
     <head>
          <title> JavaScript Math log() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.log( 10 );
               document.write("First Test Value :  "  +  value  +  "<br />"  );   

                var  value =  Math.log( 0 );  
               document.write("Second Test Value :  "   +  value  +  "<br />" );                   

                var  value =  Math.log( -1 ); 
               document.write("Third Test Value :  "   +  value  +  "<br />" );    

                var  value =  Math.log( 100 );
               document.write("Fourth Test Value :  "  +  value );
          </script>
     </body>
</html>

Output

Below is the output of the above example.

First Test Value :  2.302585092994046
Second Test Value :  -infinity
Third Test Value :  NaN
Fourth Test Value :  4.605170185988092

The Math max Method

This method returns the largest of zero or more numbers. If no arguments  are given, the result is -infinity.

Syntax

Its syntax is as follows -

Math.max(value1,   value2, ....  valueN );

Parameter Details

value1,   value2, ....  valueN - Numbers.

Return Value

Returns the largest of zero or more numbers.

Example

Try the following example below.

<html>
     <head>
          <title> JavaScript Math max() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.max( 10,  20,  -1,  100 );
               document.write("First Test Value :  "  +  value  +  "<br />"  );   

                var  value =  Math.max( -1,  -3,  -40 );  
               document.write("Second Test Value :  "   +  value  +  "<br />" );                   

                var  value =  Math.max( 0,  -1 ); 
               document.write("Third Test Value :  "   +  value  +  "<br />" );    

                var  value =  Math.max( 100 );
               document.write("Fourth Test Value :  "  +  value );
          </script>
     </body>
</html>

Output

Below is the output of the above example.

First Test Value :  100
Second Test Value :  -1
Third Test Value :  0
Fourth Test Value :  100

You can also read our tutorial post on: JavaScript Variables

The Math min Method

This method returns the smallest of zero or more numbers. If no arguments  are given, the result is +infinity.

Syntax

Its syntax is as follows -

Math.min(value1,   value2, ....  valueN );

Parameter Details

value1,   value2, ...  valueN - Numbers.

Return Value

Returns the smallest of zero or more numbers.

Example

Try the following example below.

<html>
     <head>
          <title> JavaScript Math min() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.min( 10,  20,  -1,  100 );
               document.write("First Test Value :  "  +  value  +  "<br />"  );   

                var  value =  Math.min( -1,  -3,  -40 );  
               document.write("Second Test Value :  "   +  value  +  "<br />" );                   

                var  value =  Math.min( 0,  -1 ); 
               document.write("Third Test Value :  "   +  value  +  "<br />" );    

                var  value =  Math.min( 100 );
               document.write("Fourth Test Value :  "  +  value );
          </script>
     </body>
</html>

Output

Below is the output of the above example.

First Test Value :  -1
Second Test Value :  -40
Third Test Value :  -1
Fourth Test Value :  100


The Math pow Method
JavaScript Math pow method returns the base to the exponential power, that is, baseexponent.

Syntax
Its syntax is as follows -

Math.pow(base,  exponent );

Parameter Details
  • base - The base number.
  • exponent - The exponent to which to raise the base.

Return Value
Returns the base to the exponent power.

Example
Try the following example below.

<html>
     <head>
          <title> JavaScript Math pow() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.pow( 7,  2 );
               document.write("First Test Value :  "  +  value  +  "<br />"  );   

                var  value =  Math.pow( 8,  8 );  
               document.write("Second Test Value :  "   +  value  +  "<br />" );                   

                var  value =  Math.pow( -1,  2 ); 
               document.write("Third Test Value :  "   +  value  +  "<br />" );    

                var  value =  Math.pow( 0,  10 );
               document.write("Fourth Test Value :  "  +  value );
          </script>
     </body>
</html>

Output
Below is the output of the above example.

First Test Value :  49
Second Test Value :  16777216
Third Test Value :  1
Fourth Test Value :  0

The Math random Method
This method returns a random number between 0 (inclusive) and 1 (exclusive).

Syntax
Its syntax is as follows -

Math.random( );

Return Value
Returns a random number between 0 (inclusive) and 1 (exclusive).

Example
Try the following example below.

<html>
     <head>
          <title> JavaScript Math random() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.random(  );
               document.write("First Test Value :  "  +  value  +  "<br />"  );   

                var  value =  Math.random(  );  
               document.write("Second Test Value :  "   +  value  +  "<br />" );                   

                var  value =  Math.random(  ); 
               document.write("Third Test Value :  "   +  value  +  "<br />" );    

                var  value =  Math.random(  );
               document.write("Fourth Test Value :  "  +  value );
          </script>
     </body>
</html>

Output
Below is the output of the above example.


You can also read our tutorial post on: Css Measurement Units 

The Math round Method
This method returns a the value of a number, rounded to the nearest integer.

Syntax
Its syntax is as follows -

Math.round( x );

Return Value
Returns the value of a number that is rounded to the nearest integer.

Example
Try the following example below.

<html>
     <head>
          <title> JavaScript Math round() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.round( 0.5 );
               document.write("First Test Value :  "  +  value  +  "<br />"  );   

                var  value =  Math.round( 20.7 );  
               document.write("Second Test Value :  "   +  value  +  "<br />" );                   

                var  value =  Math.round( 20.3 ); 
               document.write("Third Test Value :  "   +  value  +  "<br />" );    

                var  value =  Math.round( -20.3 );
               document.write("Fourth Test Value :  "  +  value );
          </script>
     </body>
</html>

Output
Below is the output of the above example.

First Test Value :  1
Second Test Value :  21
Third Test Value :  20
Fourth Test Value :  -20


The Math sin Method
This method returns the sine of a number. The sin method returns a numeric value that is between -1 and 1, which represents the sine of the argument.

Syntax
Its syntax is as follows -

Math.sin( x );

Parameter Details
x - A number.

Return Value
Returns the sine of a number.

Example
Try the following example below.

<html>
     <head>
          <title> JavaScript Math sin() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.sin( 0.5 );
               document.write("First Test Value :  "  +  value  +  "<br />"  );   

                var  value =  Math.sin( 90 );  
               document.write("Second Test Value :  "   +  value  +  "<br />" );                   

                var  value =  Math.sin( 1 ); 
               document.write("Third Test Value :  "   +  value  +  "<br />" );    

                var  value =  Math.sin( Math.PI/2 );
               document.write("Fourth Test Value :  "  +  value );
          </script>
     </body>
</html>

Output
Below is the output of the above example.

First Test Value :  0.479425538604203
Second Test Value :  0.8939966636005578
Third Test Value :  0.8414709848078965
Fourth Test Value :  1

You can also read our tutorial post: Css Backgrounds

The Math sqrt Method
This method returns the square (sqrt) root of a number. If the value of a number is negative, the sqrt method returns NaN.

Syntax
Its syntax is as follows -

Math.sqrt( x );

Parameter Details
x - A number.

Return Value
Returns the sqrt of a given number.

Example
Try the following example below.

<html>
     <head>
          <title> JavaScript Math sqrt() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.sqrt( 0.5 );
               document.write("First Test Value :  "  +  value  +  "<br />"  );   

                var  value =  Math.sqrt( 81 );  
               document.write("Second Test Value :  "   +  value  +  "<br />" );                   

                var  value =  Math.sqrt( 13 ); 
               document.write("Third Test Value :  "   +  value  +  "<br />" );    

                var  value =  Math.sqrt( -4 );
               document.write("Fourth Test Value :  "  +  value );
          </script>
     </body>
</html>

Output
Below is the output of the above example.

First Test Value :  0.7071067811865476
Second Test Value :  9
Third Test Value :  3.605551275463989
Fourth Test Value :  NaN 

The Math tan Method
This method returns the tangent of a number. The tan method returns a numeric value that represents the tangent of the angle. 

Syntax
Its syntax is as follows -

Math.tan( x );

Parameter Details
x - A number.

Return Value
Returns the tangent of a number.

Example
Try the following example below.

<html>
     <head>
          <title> JavaScript Math tan() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.tan( -30 );
               document.write("First Test Value :  "  +  value  +  "<br />"  );   

                var  value =  Math.tan( 90 );  
               document.write("Second Test Value :  "   +  value  +  "<br />" );                   

                var  value =  Math.tan( 45 ); 
               document.write("Third Test Value :  "   +  value  +  "<br />" );    

                var  value =  Math.tan( Math.PI/180 );
               document.write("Fourth Test Value :  "  +  value );
          </script>
     </body>
</html>

Output
Below is the output of the above example.

First Test Value :  6.405331196646276
Second Test Value :  -1.995200412208242
Third Test Value :  1.6197751905438615
Fourth Test Value :  0.017455064928217585


The Math toSource Method
This method returns the string "Math". But this method does not work with IE.

Syntax
Its syntax is as follows -

Math.toSource(  );

Return Value
Returns the string "Math".

Example
Try the following example below.

<html>
     <head>
          <title> JavaScript Math toSource() Method</title>
     </head>

      <body>
          <script  type = "text/javascript">
               var  value =  Math.toSource(  );
               document.write("Value :  "  +  value );   
          </script>
     </body>
</html>

Output
Below is the output of the above example.

Value :  Math 

Alright guy! we have come to the end of this tutorial on Math Object and i believe everything is well understood. If you having any difficulties in any of the examples above, feel free to let me know via the comment box below.

In my next tutorial, i will be discussing about the final JavaScript Object before moving to a brand new section of my tutorials on JavaScript. I will be discussing about Regular Expressions Object so stay tuned.

Follow us on our various social media platforms available. Thanks for reading and bye for now.

Post a Comment

Hello dear readers! Please kindly try your best to make sure your comments comply with our comment policy guidelines. You can visit our comment policy page to view these guidelines which are clearly stated. Thank you.
© 2023 ‧ WebDesignTutorialz. All rights reserved. Developed by Jago Desain