JavaScript timed loop rounding error

Question

timedLoop(10000, function() {
  health=health-0.1;
  updatecounters();
  console.log(health);
});

Health is initially set to 83.3 and console.log prints out the following statements:

83.2
83.10000000000001
83.00000000000001
82.90000000000002
82.80000000000003
82.70000000000003
82.60000000000004
82.50000000000004
82.40000000000005

It's supposed to be decreasing by 0.1 every 10 seconds, but there seems to be a floating point error. I know that I can fix this by simply rounding the variable to 2 decimal places, but why does this happen?

I think that this is just shitty compiling. If a number has a terminating decimal (less than 32 digits) or is rational, the program should be able to store the exact value instead of making shenanigans like these happen. I fully understand why multiplication and division induce floating point errors, but addition and subtraction should not cause bugs like these.

@ibrahimmahrir can you explain this? All I got when googling was an irrelevant video and some articles about advantages and disadvantages of Javascript. — Display name, Apr 30 '17 at 02:53
Same thing happens if you do this in python. It has to do with how floats are stored, nothing to do with the interpreter. — MotKohn, Apr 30 '17 at 02:58
Related: [Is floating point math broken?](https://stackoverflow.com/questions/588004/is-floating-point-math-broken) — Jonathan Lonowski, Apr 30 '17 at 03:20
For the most part you can ignore the rounding error. It is very small, if Earth is 1 unit wide then your error is the size of an atom in comparison, for most situations, Insignificant — Blindman67, Apr 30 '17 at 04:13

KevBot · Answer 1 · 2017-04-30T02:57:30.060

0

You can called .toFixed on the number after the subtraction.

let health = 83.3;

setInterval(function() {
  health = (health - 0.1).toFixed(1);
  console.log(health);
}, 500);

However, .toFixed will convert the number to a string, if you need to keep it as a number, you can wrap the code with the number constructor:

Number((health - 0.1).toFixed(1));

edited Apr 30 '17 at 02:57

answered Apr 30 '17 at 02:53

KevBot

17,900
5
50
68

1

You should mention that `health` becomes a string. – ibrahim mahrir Apr 30 '17 at 02:54
@ibrahimmahrir, great point. Can be a good "gotcha" if not careful – KevBot Apr 30 '17 at 02:58

score 0 · Accepted Answer · answered Apr 30 '17 at 02:55

0

The issue is not with javascript but it applies to all floating point calculations since 0.1 and 0.2 and 0.3 are not exactly representable.

Check this link to know more about it

answered Apr 30 '17 at 02:55

brk

48,835
10
56
78

While it makes sense that Javascript uses base 2 for floating point representations in general, it should use base 10 for mathematical operations. – Display name Apr 30 '17 at 03:01
2

@Displayname Computers pretty much run on base 2. – James Apr 30 '17 at 03:07

score 0 · Answer 3 · answered Apr 30 '17 at 03:05

Floating point issues are just part of life. You need to learn to live with them.

You could try:

// health (String) is for display, can be values from 100.0 to 0.1
var health = "100.0";
// healthMath (Int) is for calculations. It is an int, not a float. 
var healthMath = 1000;

So, in your example:

timedLoop(10000, function() {
  healthMath -= 1;
  health = (healthMath / 10).toFixed(1);
  updatecounters();
  console.log(health);
});

JavaScript timed loop rounding error

3 Answers3