JavaScript

Math.floor(), Math.ceil(), Match.trunc(), and Math.round() methods in JavaScript

JavaScript is one of the well-known programming languages right now, and that is because it has either a package or a library for almost every problem a programmer might face. When developing a JavaScript program or a full-stack web application you have to deal with numbers. In some cases, you do not want a floating number in your variable, that is where the Math Object comes into play.

Let’s start by discussing the Math Object very briefly because it is a good practice to understand the basics of something when trying to learn something new.

The Math Object

Math object is a global object that comes in-built with JavaScript and allows users to perform a variety of mathematical functions when working on a problem that requires such help. What we mean by the term “Global Object” is that you don’t need to create an object of it before using it. However, Math object is not like other global objects, as it is not a constructor. The reason for this is that the Math object and all of the methods inside it are static and that is why we don’t normally call it a “function Object”.

Math.methods

Math object contains many different methods and we are going to discuss four of them which help us convert any number into an integer: a real number (a number value without the fractional part).

The four methods of Math object are:

  • Math.round()
  • Math.ceil()
  • Math.floor()
  • Math.trunc()

Syntax

The syntax remains the same for all these four methods and that is:

Math.method(number \ variable containing number)

Math.round(x)

This method is quite simple, it takes a number, rounds it off to its nearest real number, and returns that value as an integer.

Rounds it off to its nearest number means if the floating-point number after the decimal point is greater than “.50” then the number would round up to the next number. For example, the number “4.57” would round up to “5”. Similarly, if the decimal number after the decimal point is less than or equal to “.50” then the number would round down to the same number e.g. “4.47” would round down to “4”.

Let’s take a number whose floating-point number is less than “.50” and store it in a variable like so:

const numberValue = 138.2293;

Now, let’s pass this value to the Math.round() method and then print it out using console.log() function, just like:

console.log(Math.round(numberValue));

Complete Code Snippet

const numberValue = 138.2293;

console.log(Math.round(numberValue));

Output

You can witness that the number “138.2293” is rounded down to “138”.

Here is another example in which we are feeding a number whose floating point number is greater than “0.50” plus we are directly using a number in the parameters of the Math.round() function.

Now, the Math.round() method has rounded up “1.57” to “2” and returned “2” as a result.

Math.ceil(x)

Math.ceil() method rounds up the number given to it in its parameters. No matter whether the floating point number is greater than or less than “.50”, the Math.ceil() method will simply round up the number given to it e.g. “4.37” would round up to “5” even if the floating point number is “.37”.

Let’s take a number and store it in a variable like so:

const numberValue = 30.12;

Now, let’s pass this value to the Math.ceil() method and then print it out using console.log() function, just like:

console.log(Math.ceil(numberValue));

Complete Code Snippet

const numberValue = 30.12 ;

console.log(Math.ceil(numberValue));

Output

You can witness that even if the floating point number is as low as “.12” but Math.ceil() method has rounded up the number to “31”.

Let’s take another example of Math.ceil() method in which we will feed the number with floating point number “.00” to the math.ceil() function:

The output is “922” and you can confirm from this example that the number always gets rounded up using the Math.ceil() method.

Math.floor(x)

Math.floor() does the exact opposite of the Math.ceil() method, it rounds down the number.

For example, let’s take a number whose floating-point number is greater than “.5” and store it in a variable like so:

const numberValue = 53.784;

Now, lets pass this value to the Math.floor() method and then print it out using console.log() function, just like:

console.log(Math.floor(numberValue));

Code Snippet

const numberValue = 53.784 ;

console.log(Math.floor(numberValue));

Output

You can see that even if the floating point number is greater than “.5” but Math.floor() method has rounded down the number to “53”.

Here is an example of Math.floor() method without using a variable to store the number:

Math.trunc(x)

This Math.trunc() method returns only the integer part of the number, the part before the decimal point “.”. It doesn’t round off anything. For example, let’s take a number and store it in a variable like so:

const numberValue = 434.021395753;

Now, let’s pass this value to the Math.trunc() method and then print it out using console.log() function, just like:

console.log(Math.trunc(numberValue));

Complete Code Snippet

const numberValue = 434.021395753 ;

console.log(Math.trunc(numberValue));

Output

Here is another example without storing the value in a variable:

console.log(Math.trunc(874.921395753));

All four methods together

There is no such constraint that limits us to use only one of these methods on a single number or a single variable. We can use all of these methods on a single variable as well. Just like shown below:

Code Snippet

Try out these commands in the browser’s console (F12 for chrome)

number = 6632.678501;

Math.round(number);

Math.ceil(number);

Math.floor(number);

Math.trunc(number);

Output

Conclusion

As a programmer you have to deal with numbers and for that mathematical functions are used. Mathematical functions are exercised on a numerical value to convert them into a real number or an integer. In JavaScript, the Global Math object performs various mathematical operations. In this tutorial, we covered four different JavaScript methods to modify the numbers with examples, that are Math.round(), Match.ceil(), Math.floor and Math.trunc().

About the author

Shehroz Azam

A Javascript Developer & Linux enthusiast with 4 years of industrial experience and proven know-how to combine creative and usability viewpoints resulting in world-class web applications. I have experience working with Vue, React & Node.js & currently working on article writing and video creation.