What is the difference between Number(…) and parseFloat(…)

Question

What is the difference between parseInt(string) and Number(string) in JavaScript has been asked previously.

But the answers basically focused on the radix and the ability of parseInt to take a string like "123htg" and turn it into 123.

What I am asking here is if there is any big difference between the returns of Number(...) and parseFloat(...) when you pass it an actual number string with no radix at all.

Answer 1

No. Both will result in the internal ToNumber(string) function being called.

From ES5 section 15.7.1 (The Number Constructor Called as a Function):

When Number is called as a function rather than as a constructor, it performs a type conversion...

Returns a Number value (not a Number object) computed by ToNumber(value) if value was supplied, else returns +0.

From ES5 section 15.1.2.3 (parseFloat (string)):

... If neither trimmedString nor any prefix of trimmedString satisfies the syntax of a StrDecimalLiteral (see 9.3.1) ...

And 9.3.1 is the section titled "ToNumber Applied to the String Type", which is what the first quote is referring to when it says ToNumber(value).

---

Update (see comments)

By calling the Number constructor with the new operator, you will get an instance of the Number object, rather than a numeric literal. For example:

typeof new Number(10); //object
typeof Number(10); //number

This is defined in section 15.7.2 (The Number Constructor):

When Number is called as part of a new expression it is a constructor: it initialises the newly created object.

Answer 2

The internal workings are not that different, as @James Allardic already answered. There is a difference though. Using parseFloat, a (trimmed) string starting with one or more numeric characters followed by alphanumeric characters can convert to a Number, with Number that will not succeed. As in:

parseFloat('3.23abc'); //=> 3.23
Number('3.23abc'); //=> NaN

In both conversions, the input string is trimmed, by the way:

parseFloat('  3.23abc '); //=> 3.23
Number('   3.23 '); //=> 3.23

Answer 3

Not a whole lot of difference, as long as you're sure there's nothing but digits in your string. If there are, Number will return NaN.
Another problem that you might get using the Number constructor is that co-workers might think you forgot the new keyword, and add it later on, causing strict comparisons to fail new Number(123) === 123 --> false whereas Number(123) === 123 --> true.

In general, I prefer to leave the Number constructor for what it is, and just use the shortest syntax there is to cast to an int/float: +numString, or use parse*.

Answer 4

When not using new to create a wrapper object for a numerical value, Number is relegated to simply doing type conversion from string to number.

'parseFloat' on the other hand, as you mentioned, can parse a floating point number from any string that starts with a digit, a decimal, or +/-

So, if you're only working with strings that contain only numerical values, Number(x) and parseFloat(x) will result in the same values

Answer 5

Please excuse me posting yet another answer, but I just got here via a Google search and did not find all of the details that I wanted. Running the following code in Node.js:

var vals = ["1", "1.1", "0", "1.1abc", "", " ", null];
for(var i = 0; i < vals.length; i++){
  var ifTest = false;
  if(vals[i])
  {
    ifTest = true;
  }
  console.log("val=" + vals[i] + ", Number()=" + Number(vals[i])+ ", parseFloat()=" + parseFloat(vals[i]) + ", if()=" + ifTest);
}

gives the following output:

val=1, Number()=1, parseFloat()=1, if()=true
val=1.1, Number()=1.1, parseFloat()=1.1, if()=true
val=0, Number()=0, parseFloat()=0, if()=true
val=1.1abc, Number()=NaN, parseFloat()=1.1, if()=true
val=, Number()=0, parseFloat()=NaN, if()=false
val= , Number()=0, parseFloat()=NaN, if()=true
val=null, Number()=0, parseFloat()=NaN, if()=false

Some noteworthy takeaways:

1. If protecting with an if(val) before trying to convert to number, then parseFloat() will return a number except in the whitespace case.
2. Number returns a number in all cases except for non-numeric characters aside from white-space.

Please feel free to add any test cases that I may be missing.