+ operator vs parseFloat

Question

Example 1 of the knockout extenders page describes a way of rounding user input and making sure it is only numeric.

It works great, but looking through the source they do a peculiar thing that i don't understand, that is on line 8 they do this:

parseFloat(+newValue)

newValue is a string.

When i initially asked this question I didn't know what + did - some further poking and a link to a different MDN page from one of the initial answers I got indicate it is a unary operator equivalent to number(str) and that there are some differences between +str and parseFloat(str) (treatment of strings ending in alpha characters and interpretation of hex seem to be the headlines).

I still don't understand why the + in this case needed to be wrapped in the parseFloat although I am starting to think it might be a typo...

I just found this http://stackoverflow.com/questions/12227594/which-is-better-numberx-or-parsefloatx question which is similar - the answerers explanation of the differences between parseFloat and + are pretty good. But it still doesn't explain why the number should be parsed afterwards... — jaybeeuu, Oct 28 '15 at 15:26
It simply makes no sense to use both. Calling `parseFloat` on a number is an antipattern. — Bergi, Oct 28 '15 at 15:30
No, `parseFloat` is not equivalent to `|| 0`. It still yields `NaN` for example — Bergi, Oct 28 '15 at 16:12
sorry, you are quite right - i was referring to the entire thing in the original example - i.e. `isNaN(newValue) ? 0 : parseFloat(+newValue)` — jaybeeuu, Oct 28 '15 at 16:39
Does this answer your question? [Which is better, number(x) or parseFloat(x)?](https://stackoverflow.com/questions/12227594/which-is-better-numberx-or-parsefloatx) — Heretic Monkey, Oct 12 '20 at 19:43

score 15 · Accepted Answer · edited Dec 20 '20 at 14:57

15

Citing MDN docs for parseFloat:

parseFloat parses its argument, a string, and returns a floating point number. If it encounters a character other than a sign (+ or -), numeral (0-9), a decimal point, or an exponent, it returns the value up to that point and ignores that character and all succeeding characters. Leading and trailing spaces are allowed.

Using [unary plus operator][2] you may be sure that `parseFloat` operates on `Number`, which is only useful if you want to be more strict about results but still want to use a `parseFloat`
parseFloat('0.32abcd') // -> 0.32 parseFloat(+'0.32abcd') // -> NaN
**Update:**

After a bit of digging in docs and running some tests, seems there is no reason to use parseFloat other than parsing strings that may contain numbers with non numeric trails to number, eq:

parseFloat('31.5 miles') // -> 31.5
parseFloat('12.75em') // -> 12.75

For any other cases where your string contains number + is a fastest and prefered way (citing MDN docs for unary plus operator):

unary plus is the fastest and preferred way of converting something into a number, because it does not perform any other operations on the number.

See parseFloat versus unary test case for how faster it is.

Previous link broken so here is the new test that shows how unary is faster.

edited Dec 20 '20 at 14:57

subcoder

636
8
15

answered Oct 28 '15 at 15:20

Juicy Scripter

25,778
6
72
93

1

Sure, but why is `parseFloat(+'0.32abcd')` different from `+'0.32abcd'`? – jaybeeuu Oct 28 '15 at 15:27
what do you cite? How does that answer the questions? – Bergi Oct 28 '15 at 15:31
1

@Bergi, I'm citing MDN. Added reference and bit explanation – Juicy Scripter Oct 28 '15 at 15:45
2

But parseFloat is supposed to operate on a string - why would you want it to operate on a number? – jaybeeuu Oct 28 '15 at 15:55
@JoshWallace, because it's not strict enough. BTW, MDN describe this behavior and also provide sample for a [stricter parse function](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/parseFloat#A_stricter_parse_function) – Juicy Scripter Oct 28 '15 at 16:44
2

@JuicyScripter But that MDN page is addressing a different problem and describing how to use regexp. In this case, I still don't understand why the `parseFloat` is necessary and what value it adds. Can you please try to explain that clearly, and give an example of a case where `+xxxxx` means something different from `parseFloat(+xxxxx)`? – Oct 28 '15 at 16:55
1

@torazaburo, where is no real reason to use `parseFloat(+xxx)` it's just pure overhead. See my updated answer. – Juicy Scripter Oct 29 '15 at 08:45
late to the party, but just wanted to add that null handling and empty strings should also be considered -- eg ```parseFloat(null)``` is NaN but ```+null``` is 0. Depending on what you are doing this might be unexpected behavior – TaDaa Aug 13 '21 at 19:22

+ operator vs parseFloat

1 Answers1

Linked