This article explores various number rounding methods in JavaScript, including using JavaScript mathematical functions and other methods of rounding to decimal places. We will also introduce issues that need to be paid attention to when rounding numbers.

Key Points

• JavaScript provides several ways to round numbers, including Math.round, Math.floor, Math.ceil, and Math.trunc. Math.roundRound to the nearest integer, Math.floorRound down, Math.ceilRound up, Math.truncTruncate the fractional part of the number.
• JavaScript provides Number.toFixed and Number.toPrecision methods for rounding numbers to specific decimal places or significant numbers. These methods return the rounded number as a string.
• When dealing with negative numbers, the behaviors of Math.round, Math.floor, Math.ceil, and Math.trunc differ. For example, Math.floor rounds the negative number down to the next smallest integer, while Math.trunc truncates the fractional part, effectively rounding it upwards.
• Because of the binary representation of numbers, precision issues may occur in JavaScript. Some decimal numbers cannot be represented accurately in binary, resulting in rounding errors. The Math.fround method can be used to find the closest representable number of 32 bits.
• The selection of rounding method depends on the specific use case. Math.round is a good general choice for rounding to the closest integer, but Math.floor, Math.ceil or Math.trunc may be better suited to always round down or up, or to deal with negative numbers. Number.toFixed or Number.toPrecision applies to rounding to a specific decimal or significant number.

JavaScript rounding

When processing numeric values, we sometimes perform calculations that end up producing fractional portions that need to be rounded to the integers—for example, when you calculate the average price or process random numbers. Fortunately, JavaScript's Math object provides many ways to round numbers to integer values.

In our example, we will demonstrate different types of rounding using two most important mathematical constants: π (the ratio of the perimeter of a circle to its diameter) and e (the base of natural logarithm, also known as "Euler number"). Both values ??are properties of Math objects, but let's assign them to some variables to make it easier to handle:

const PI = Math.PI;
const E = Math.E;

Pro tip: You can also use object destruction to make this assignment in a line:

const { PI, E } = Math;

Now that we have defined these constants, let's take a look at some methods for rounding numbers in JavaScript.

Round numbers in JavaScript using Math.round

. This is the most straightforward choice, it just rounds any number with a fractional part to the closest integer. It uses the following rule: If a number is exactly between two integers, round it up. For example, 2.5 will round up to 3. Math.round

const PI = Math.PI;
const E = Math.E;

is very convenient. For example, if you are calculating the average score of three tests, add the three scores and divide them by three. This may not get an integer, so you can round it to the closest value using Math.round(): Math.round()

const { PI, E } = Math;

Math.floor

. This always rounds the value down to the integer below (name means the number is pushed down to the "floor"): Math.floor

Math.round(2.3); // 因為更接近2，所以向下舍入

Math.round(2.921); // 因為更接近3，所以向上舍入

Math.round(2.5); // 因為正好位于中間，所以向上舍入

Math.round(PI);

Math.round(E);

is to create random integers. Rounding down ensures that the integer starts from zero and that each integer has the same chance of being returned. Starting from zero is often useful because arrays in JavaScript are zero-indexed, so rounding down will ensure that the first element in the array can be selected. The following example shows how to select a random element from an array using Math.floor: Math.floor

const test1 = 86;
const test2 = 93;
const test3 = 95;
const average = Math.round((test1 + test2 + test3) / 3);

rounding down to ensure that an index between 0 and 4 is returned, so each element in the array has the same chance of being selected. Math.floor

Math.ceil

does. This name comes from "ceiling", which, contrary to "flooring", means that the value is rising. This method works the same way as all other methods. Just provide the number you want to round up as the parameter: Math.ceil

Math.floor(2.3); // 向下舍入到2

Math.floor(2.921); // 向下舍入到2

Math.floor(2.5); // 向下舍入到2

Math.floor(PI);

Math.floor(E);

const fruit = ["?", "?", "?", "?", "?"];

const randomFruit = fruit[Math.floor(Math.random() * fruit.length)];

will round it down to 8... However, we won't create a playlist for the last two songs! In this case we always need to round up so that we can provide an extra container for any remainder: Math.round

Math.ceil(2.3); // 向上舍入到3

Math.ceil(2.921); // 向上舍入到3

Math.ceil(2.5); // 向上舍入到3

Math.ceil(PI);

Math.ceil(E);

Math.trunc

. Strictly speaking, this is not a rounding function; it is actually truncating the provided parameter numbers. It basically just deletes the decimal part of the number, leaving only the integer part, as shown in the following example: Math.trunc

const PI = Math.PI;
const E = Math.E;

At first glance, Math.trunc seems to be the same as Math.floor; of course, all the examples given so far give the same results. However, when a negative value is provided as a parameter, the two methods behave differently, as shown in the following example:

const { PI, E } = Math;

to round down the negative number, it rounds down to the next smallest integer, and truncating a negative value is equivalent to rounding it upwards. Math.floor

returns the same value as Math.ceil: Math.trunc

Math.round(2.3); // 因為更接近2，所以向下舍入

Math.round(2.921); // 因為更接近3，所以向上舍入

Math.round(2.5); // 因為正好位于中間，所以向上舍入

Math.round(PI);

Math.round(E);

will round the number to the nearest integer. Unfortunately, the Math.round object does not provide any way to round numbers to a specific decimal place with more precise accuracy. Fortunately, the Math type has some built-in ways to do this. Let's take a look at them. Number

Number.toFixed

const test1 = 86;
const test2 = 93;
const test3 = 95;
const average = Math.round((test1 + test2 + test3) / 3);

. You can solve this problem by wrapping the method call in a function, which converts the result back to a number: Number

Math.floor(2.3); // 向下舍入到2

Math.floor(2.921); // 向下舍入到2

Math.floor(2.5); // 向下舍入到2

Math.floor(PI);

Math.floor(E);

const fruit = ["?", "?", "?", "?", "?"];

const randomFruit = fruit[Math.floor(Math.random() * fruit.length)];

Math.ceil(2.3); // 向上舍入到3

Math.ceil(2.921); // 向上舍入到3

Math.ceil(2.5); // 向上舍入到3

Math.ceil(PI);

Math.ceil(E);

const songsPerPlaylist = 10;
const numberOfSongs = 82;
const numberOfPlaylists = numberOfSongs / songsPerPlaylist;

const numberOfPlaylists = Math.ceil(numberOfSongs / songsPerPlaylist);

Number.toFixed

Math.trunc(2.3); // 只留下2

Math.trunc(2.921); // 只留下2，即使它更接近3

Math.trunc(2.5); // 只留下2

Math.trunc(PI);

Math.trunc(E);

issues you may have, see Number().toFixed() rounding error: corrupted but fixable. toFixed()

Round to decimal places using Number.toPrecision

const PI = Math.PI;
const E = Math.E;

const { PI, E } = Math;

Math.round(2.3); // 因為更接近2，所以向下舍入

Math.round(2.921); // 因為更接近3，所以向上舍入

Math.round(2.5); // 因為正好位于中間，所以向上舍入

Math.round(PI);

Math.round(E);

const test1 = 86;
const test2 = 93;
const test3 = 95;
const average = Math.round((test1 + test2 + test3) / 3);

Math.floor(2.3); // 向下舍入到2

Math.floor(2.921); // 向下舍入到2

Math.floor(2.5); // 向下舍入到2

Math.floor(PI);

Math.floor(E);

const PI = Math.PI;
const E = Math.E;

const { PI, E } = Math;

Math.round(2.3); // 因為更接近2，所以向下舍入

Math.round(2.921); // 因為更接近3，所以向上舍入

Math.round(2.5); // 因為正好位于中間，所以向上舍入

Math.round(PI);

Math.round(E);