7

I'm experiencing rounding errors when using toFixed:

I used toFixed(2) on my numeric value calculations, but the rounding results are not as expected for few cases.

Suppose that toFixed(2) is applied for value 17.525 then it gives the result 17.52, And if it is applied for 5.525 then it gives the result 5.53.

In the later case the rounding result is accurate, so can you please suggest what needs to be done to get the accurate rounding result as in the later case. Or can you please suggest an alternative to this toFixed function to get correct rounding results?

Akshay
  • 73
  • 5
  • 1
    FYI, this has nothing to do with jQuery. It's a JavaScript function https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number/toFixed. – alexn May 26 '12 at 16:46
  • 2
    That result is perfectly okay. Mantissa-exponent floating point numbers are a lie. Try `toFixed(20)` and then compare. –  May 26 '12 at 16:59
  • possible duplicate of [Using toFixed(2) and math round to get correct rounding](http://stackoverflow.com/questions/2861055/using-tofixed2-and-math-round-to-get-correct-rounding) –  May 26 '12 at 17:01
  • I believe that if you execute `17.525.toFixed(2)` you'll get `17.53` (I do) and so the result of `17.52` is produced from another value, less than 17.525. – panda-34 May 26 '12 at 17:03
  • Oops, please don't close for that "duplicate". It's similar, but that's for a specific rounding case. There ought to be a better one! –  May 26 '12 at 17:07
  • @panda-34: I got 17.52 in Firefox (Windows). – nhahtdh May 26 '12 at 17:09
  • http://stackoverflow.com/questions/2861055/using-tofixed2-and-math-round-to-get-correct-rounding (similar idea) –  May 26 '12 at 17:26
  • @nhahtdh Yeah, on a second thought, it's probably a bug in my system. 17.52 is the correct result according to ECMA specification. I'm not sure that I don't like this microsoft's bug because it does make sense. – panda-34 May 26 '12 at 17:28
  • I think it's only inconsistent in some browsers (IE11 seems consistent, FF and Chrome are inconsistent).See [this answer](http://stackoverflow.com/a/23204425/573634) for a function that works across all browsers. – Hanna Mar 29 '16 at 16:54

4 Answers4

5

Floating point inaccuracy means that most numbers ending .525 are actually .52500..1, and others are .5249999.....

Which way the value rounds depends on whether the closest actual representation in IEEE-754 floating point is above or below the desired value.

Alnitak
  • 334,560
  • 70
  • 407
  • 495
  • `17.525.toFixed(3)` `"17.525"` Dropping the last digit gives `"17.52"` which is wrong? I get different results in different browsers though, so I doubt `toFixed` is any good :P – Esailija May 27 '12 at 11:53
  • @Esailija no, I think 17.52 would be a valid response in that case. – Alnitak May 27 '12 at 18:02
  • @Alnitak maybe I misunderstood the OP then because he said that's wrong... but OTOH he accepted this so what do I know :) – Esailija May 27 '12 at 18:03
  • @Esailija yeah, and I just realised it does the wrong thing for 17.529 too. Hmm. – Alnitak May 27 '12 at 18:06
  • @Alnitak there is also differences between browsers, for me `17.525.toFixed(2)` is `"17.52"` in chrome but `"17.53"` in IE9. So some custom solution is most likely needed – Esailija May 27 '12 at 18:07
3

Instead of toFixed() use Math.ceil() , Math.floor() or Math.round()

with a way around like

var rnum = 5.525,
    decimalPlaces = 2,
    factor = Math.pow(10, decimalPlaces),
    newnumber = Math.round(rnum * factor) / factor,
    mydecimalvalue = parseFloat(newnumber);

the result is 5.53

Kirill
  • 406
  • 3
  • 11
Raab
  • 34,778
  • 4
  • 50
  • 65
  • But these return integer values... how can it be used here? –  May 26 '12 at 17:20
  • After you multiply the number by 100, the number already loses the precision, so using those methods doesn't really help. – nhahtdh May 26 '12 at 17:36
  • @rab nawaz khan : the result you got is 5.23 but it should be 5.53, so how can this is possible. This is way away from the expected result which should be 5.53 – Akshay May 27 '12 at 01:11
1

Convert the number to String and work with it?

That is the last resort after I have tried to use Math.round, or simulate the nearest rounding with Math.ceil, but failed. When multiplying with 100, some number (such as 17.525) will be a bit less than 100 times its value (1752.5), while other numbers (such as 17.545) will be a bit more than 100 times its value (1754.5).

nhahtdh
  • 55,989
  • 15
  • 126
  • 162
  • I'm not exactly sure how converting the numbers to strings would help... just seems like more work. –  May 26 '12 at 17:22
  • We will work on the decimal representation instead of binary representation of the number. It is "visually correct" when we print the value before and after the rounding. – nhahtdh May 26 '12 at 17:26
1

Use Intl.NumberFormat and in options set minimumFractionDigits and maximumFractionDigits to the same number (number of digits you want to display).

const formatter = [0, 1, 2, 3, 4, 5].map(
    (decimals) =>
        new Intl.NumberFormat('en-US', {
            minimumFractionDigits: decimals,
            maximumFractionDigits: decimals,
        }),
);

console.log(formatter[2].format(17.525)); // 17.53
console.log(formatter[2].format(5.525)); // 5.53
console.log(formatter[2].format(1.005)); // 1.01
console.log(formatter[2].format(8.635)); // 8.64
console.log(formatter[2].format(8.575)); // 8.58
console.log(formatter[2].format(35.855)); // 35.86
console.log(formatter[2].format(859.385)); // 589.39
console.log(formatter[2].format(859.3844)); // 589.38
console.log(formatter[2].format(.004)); // 0.00
console.log(formatter[2].format(0.0000001)); // 0.00

// keep in mind that this will not be formatted as expected, as the value that
// you pass is actually 0.07499999999998863. 
console.log(formatter[2].format(239.575 - 239.5)); // 0.07
console.log(formatter[2].format(0.07499999999998863)); // 0.07
dugokontov
  • 4,402
  • 1
  • 25
  • 25