The Simple and Not Boring Guide to Rounding Accurately in Javascript

Jessica Bradham
3 min readNov 16, 2023

--

There is a big problem in javascript. You might have heard software engineers joke that Javascript is bad at math, and if you’ve ever tried to have Javascript do some math for you, for example

a javascript console showing “.11 + .7” and the return value is “0.8099999999999999”
Javascript says .11 + .7 = 0.809999999(…) but my calculator says it’s .81

Or perhaps you’ve tried some rounding, and gotten an unexpected result such as

A javascript console showing “Math.round(1.005 * 100) / 100” and the return value is “1”
If I make that number “1.0055” instead of “1.005” it returns “1.01” instead of “1”

There are a number of posts explaining the details about why this is happening, so I’m just going to focus on fixing it. Because it’s a lengthy explanation, and this post is just about fixing it.

A common solution is to use the method toFixed() in order to correct this mistake. And I can just hear you asking, “Well if it works, why not?”

A meme says “The Loudest Sounds on Earth” and shows a bar chart, listing from quietest to loudest: Concert Speakers, Fireworks, Gunfire, Blue Whale, Space Shuttle, and finally “You asking ‘Why not use toFixed tho!?’”
Omg I’m getting to the answer!

Well there are a few reasons I wouldn’t recommend it, one of them being that toFixed is converting your float to a string, which means you have to run parseInt to convert the type back, and running parseInt leaves it prone to new inaccuracies. Doing all those conversions can all a lot of unnecessary time to your function (even these built in functions have a time cost.)

But my favorite reason to not use toFixed is it’s still not accurate.

A javascript console shows “(1.005).toFixed(2)” and the return value is “‘1.00’”
Wasn’t that supposed to be 1.01? 😒

So don’t use it to try to fix rounding errors.

A meme shows Sandy from spongebob on a platform with a megaphone shouting. Text says “Drop toFixed() and back away slowly”
Don’t even look at it. If you use it, you better have a reason. Like you need a string returned.

On to the solution! What’s a poor Software Engineer who really just needs to round 1.005 to do!?

A meme shows Steve Harvey playing family feud, looking uncertain. The question is “How to round floating points accurately in javascript!?” The answers are, “A: give up and cry”, “B: Read the rest of this blog”, “C: wish on a star”, “D: Blackmail a leprechaun”
Can I phone a friend?!

Well the answer looks scary, and sounds scary, but it isn’t as complicated as you’d imagine. We’re going to use exponential notation.

An anime meme in three panels shows a girl labeled “exponential notation” following a boy labeled “you”. In the second panel, she starts to run and he runs away. In the third panel she is chasing him, and he’s running fast.
Get back here! I said it wasn’t that scary!

Again. There are great articles breaking down exponential notation. I’m just going to show you how to use it! So no need to fear!

A javascript console which says “Number(Math.round(1.005 + ‘e2’) + ‘e-2’)” and the return value reads, “1.01”
It’s that easy, we get to us ‘e2’ and ‘e-2’ as a shortcut.

So instead of (1.005 * 100) / 100 we’re going to be doing (e3 and e-3 if you want it rounding to the thousands place, e4 and e-4 for ten thousands, etc. This is e-notation in javascript).

A meme of drake looking away and holding his hand up as if to stop something. The meme says “console.log((Number(Math.round(1.005 * 100) / 100)), in the second panel Drake looks happy and the meme says ‘console.log(Number(Math.round(1.005 + “e” + 2) + “e-” + 2))’
this uses a setup where the 2 could be replaced with a variable, because I’m a lazy duck and copied some old code of mine and just wrote the two

And there we have it. It’s as simple as that. Enjoy your newfound powers of accurate rounding in Javascript, all without converting your data type.

A meme of Meghan Trainer from the Music Video “All About that Bass” except it says “You know I’m all about that exponential notation, no string conversion”
Because converting data types can lead to unexpected bugs. Ask me how I know? I once got assigned, and had to fix a bug where the number was being converted to a string, and then sent to an API that expected a number. I now feel like a wisened old exponential-notation war veteran, sitting in my rocking chair, warning the youth about the evils of toFixed.

--

--

Jessica Bradham
Jessica Bradham

Written by Jessica Bradham

Jessica is a Software Engineer who has been coding since she was a teen, she has 2 giant dogs, a love of javascript, and hates Papyrus (the font).

No responses yet