Why is one form input constantly being treated as a string?

Question

This is a pretty basic SIP calculator that should not take more than 5 lines. But the variable amount is constantly being treated as a string. I have to keep using parseFloat() and declare three additional variables to store the final values before returning them for the code to work. Is there any workaround?

function sipCalculator(amount, r, n) {
  r = r / 12;
  amount = parseFloat(amount);
  var temp = 0;
  for (var i = 0; i < n; i++) {
    temp += amount;
    temp += (temp * (r / 100));
  }
  var x = amount * n;
  var y = parseFloat(temp.toFixed(2));
  var z = parseFloat((y - x).toFixed(2));
  return [x, y, z];
};

How do you call the function? As in what parameters are you passing? Also, `.toFixed(2)` converts the number to a string, if you aren't already aware. — Nisarg Shah, Mar 14 '19 at 05:45
`amount` would only be a string if it's passed in as a string. Other than that, `toFixed` returns a string. So I'm not sure how the variable treated as a string when it shouldn't. — VLAZ, Mar 14 '19 at 05:46
Possible duplicate of [HTML input type="number" still returning a string when accessed from javascript](https://stackoverflow.com/questions/35791767/html-input-type-number-still-returning-a-string-when-accessed-from-javascript) and [Input value is a string instead of a number](https://stackoverflow.com/questions/27849944) — adiga, Mar 14 '19 at 05:48

Nisarg Shah · Answer 1 · 2019-03-14T06:00:36.423

1

The call to .toFixed(2) is converting the numbers to a string. If you instead want them to be numbers, while limiting them up to two decimal places, then parseFloat(num.toFixed(2)) is the recommended approach (which you are already doing).

Here's MDN's documentation on Number.prototype.toFixed: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toFixed

If you just don't like the verbosity of parseFloat, you can use + instead to convert the string to a number. Of course that's not the best idea as not everyone would know what it does.

var x = 1.44444;
console.log(+x.toFixed(2));

edited Mar 14 '19 at 06:00

answered Mar 14 '19 at 05:50

Nisarg Shah

14,151
6
34
55

So there is nothing wrong with what I am already doing? I guess this is an issue with the input tag that I am using to get the data. – Tethys_94 Mar 15 '19 at 06:33
@Tethys_94 Yup, sort of. Basically when you read value of an text input, it will always be a string. So to get a number, you have to use `parseFloat`. Same goes for `.toFixed`. It is not wrong as long as it is a requirement. – Nisarg Shah Mar 15 '19 at 06:38
You can't store a numeric value with 2 fraction digits. The number is always rounded (with some exceptions) to the nearest possible value. Exceptions are numbers like 0.50 0.25 0.125 0.375. That's the reason, that toFixed() returns a string. – Wiimm Mar 16 '19 at 11:20
@wimm I don't understand your point in the context of this question. OP is not asking **why** `toFixed` returns a string. – Nisarg Shah Mar 16 '19 at 13:05

Why is one form input constantly being treated as a string?

1 Answers1