Is there a difference between Number and parseFloat?

Question

When I need to turn a string into a number in Javascript, I can use both the object Number as the function parseFloat.

Example:

var numero = "1.5";

console.log(Number(numero));
console.log(parseFloat(numero));

But I would like to know if there is any case where another has different behaviors.

• Which of the two should I prefer to convert a string into one Number float-type?
• Is there any difference between the two?

Answer 1

There’s a difference in some cases.

For empty string or containing only spaces, or for null, Number returns zero and parseFloat returns NaN:

var numero = ""; // string vazia
console.log(Number(numero)); // 0
console.log(parseFloat(numero)); // NaN

numero = "    ";
console.log(Number(numero)); // 0
console.log(parseFloat(numero)); // NaN

numero = null;
console.log(Number(numero)); // 0
console.log(parseFloat(numero)); // NaN

Another difference is in the algorithm: parseFloat reads the characters of the string until it finds something that is not recognized as part of a number, such as the minus sign and the dot - which is the decimal separator - in addition to the "and" followed by numbers, which is part of scientific notation, and makes the Parsing only the part you were able to read. Number doesn’t do it, and returns NaN if the string has characters that are not among those already cited:

var numero = "123abc";
console.log(Number(numero)); // NaN
console.log(parseFloat(numero)); // 123

numero = "-123.45abc";
console.log(Number(numero)); // NaN
console.log(parseFloat(numero)); // -123.45

numero = "1.23e3abc"; // 1.23e3 é 1230 em notação científica
console.log(Number(numero)); // NaN
console.log(parseFloat(numero)); // 1230

---

Remembering that both ignore spaces at the beginning and end of the string (i.e., spaces at the beginning or end do not fall under the above rule of "invalid characters"):

var numero = "   123   ";
console.log(Number(numero)); // 123
console.log(parseFloat(numero)); // 123

Answer 2

The difference is subtle that can be noticed in the documentation parseFloat:

The parseFloat Function parses an argument (Converting it to a string first if needed) and Returns a floating point number.

In direct translation:

The function parseFloat does the parse of the argument (converting it to string first, if necessary) and returns a floating point number.

Already the builder Number simply tries to do the coercion value passed to the numeric type. This does not necessarily mean doing the parse, since coercion of types has different behavior than a parse.

The parse, Eventually, you can remove some characters that would be invalid by doing a simple coercion. When analyzing the difference of the algorithms described in the specification this difference becomes even more evident:

• Specification for the manufacturer Number.
• Specification for parseFloat.

Note that, as Number makes the conversion of types, it can be replaced by the unary operator +, which has the exact same function.

Let’s look at some special cases (based in this reply by Soen) for example:

• For any valid numeric input, the output will be the same since it can be parsed (for parseFloat) or converted (by Number) correctly:

  parseFloat('3'); // 3
  Number('3'); // 3
  
  parseFloat('1.501'); // 1.501
  Number('1.501'); // 1.501
  
  parseFloat('1e10'); // 10000000000
  Number('1e10'); // 10000000000
  

• Eventually, the value passed to Number may not be correctly converted to the numeric type, but may still be parsed correctly. An example of this is when the string contains additional characters:

  parseFloat('1x'); // 1
  Number('1x'); // NaN
  

• Regarding the numerical literals of the language, parseFloat can’t handle strings representing them as Number, yes. That means that Number can convert from the literal syntax of binary, octal and hexadecimal (as well as decimal - already treated earlier):

  parseFloat('0b10'); // 0
  Number('0b10'); // 2
  
  parseFloat('0o10'); // 0
  Number('0o10'); // 8
  
  parseFloat('0xf'); // 0
  Number('0xf');
  

  ^{IN the above example, parseFloat returns 0 because read the string from left to right until you can no longer find valid numeric characters. How b, o and x are invalid, the rest of the string is ignored after such demarcations.}

• Regarding the literal values of the language, Number does the conversion normally, while parseFloat will always return NaN. For example, when passing boolean:

  parseFloat(true); // NaN
  Number(true); // 1
  
  parseFloat(false); // NaN
  Number(false); // 0
  

  That’s why if you pass one string empty for Number 0 will be returned.