set interval and sum random floating numbers

Question

I have got a task to solve.

On load, page should show 10 fields marked as A, B, C, D .... with value 3.
After page load, every 2 seconds all field values should be changed randomly. Change is randomly calculated as a number between 1 and 2(1.98, 1.02...), with a random sign (-, +).

At this point, I was able to set the initial value and solve the random floating numbers, but I am struggling to sum initialValue and randomNumber because of floating points. I was able to do it properly with whole numbers.

addition() function return 31.58 instead of 4.58, which is I think right JS behavior, but I don't know how to fix it.

Here is the code so far:

<template>
  <div class="table-fields">
    <table>
      <tr>
        <th>A</th>
        <td>{{ initialValue }}</td>
      </tr>
    </table>
    <button @click="stopInterval()">Stop</button>
  </div>
</template>

<script>
export default {
  name: 'TableFields',
  props: {
    msg: String
  },
  data: function () {
    return {
      initialValue: 3,
      randomNumber: (Math.random() * 1 + 1).toFixed(2),
      interval: setInterval(this.addition, 2000)
    }
  },
  computed: {
  },
  methods: {
    addition () {
      this.initialValue += this.randomNumber
    },
    stopInterval () {
      clearInterval(this.interval)
    }
  },
  mounted () {
    // const test = this.initialValue
    console.log(this.randomNumber)
  }
}
</script>

this.initialValue += this.initialValue, does not seem right, You are trying to add initialValue to itself. — Keen Sage, Apr 10 '20 at 18:39
It's a mistake, while I was preparing the question. I've try all sorts of combination, but nothing seems to be right. I have edited the code in question. Should be something like `this.initialValue += this.randomNumber`... — Srdjan Milic, Apr 11 '20 at 03:48

xdeepakv · Accepted Answer · 2020-04-11T15:26:09.070

0

The type of toFixed is string. You can use Number class to convert to float.

Example:

-: 3 + (Math.random() * 1 + 1).toFixed(2) = 3 + "1.58" = 31.58 != 4.58

-: Number((Math.random() * 1 + 1).toFixed(2))+Number((Math.random() * 1 + 1).toFixed(2)) = 3.27 [some float]

export default {
  name: "TableFields",
  props: {
    msg: String,
  },
  data() {
    return {
      initialValue: 3,
      randomNumber: Number(Math.random() * 1 + 1),
      interval: setInterval(this.addition, 2000),
    };
  },
  computed: {},
  methods: {
    addition() {
      this.initialValue = Number(
        (this.initialValue + this.randomNumber).toFixed(2)
      );
    },
    stopInterval() {
      clearInterval(this.interval);
    },
  },
  mounted() {
    // const test = this.initialValue
    console.log(this.randomNumber);
  },
};

edited Apr 11 '20 at 15:26

answered Apr 11 '20 at 03:52

xdeepakv

7,835
2
22
32

Just one more thing. The result it's not rounded at some point at time to two decimals. I have tried this approaches [link](https://stackoverflow.com/questions/11832914/round-to-at-most-2-decimal-places-only-if-necessary), but without success. – Srdjan Milic Apr 11 '20 at 05:48
can u give me data ?? input and expected output – xdeepakv Apr 11 '20 at 08:38
Input is a `randomNumber` between 1 and 2 (1.56, 1.14...). Expected output is, for example 4.56, but after few 2s intervals of calculation `this.initialValue += this.randomNumber;` I get something like this 2.3700000000000006 very often. That is not suppose to happen because the `randomNumber` has `toFixed()` method, right? But it's happening. :) – Srdjan Milic Apr 11 '20 at 15:14
I don't know where my previous appreciation comment disappeared, so I want to thank you very much again for your help. – Srdjan Milic Apr 11 '20 at 15:18
there is issue with 0.3 ? when you try 0.1+0.2 you get this garbage. I recommend you to round after sum. – xdeepakv Apr 11 '20 at 15:22
Yes. That is the issue with binaries and decimal floating point numbers and how computer calculates those numbers. I'v just read about it. The solution you have provided does't work unfortunately. I don't want to take your time anymore. – Srdjan Milic Apr 12 '20 at 07:25

set interval and sum random floating numbers

1 Answers1