Is there a difference between number and parseFloat?

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

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 have different behaviors.

  • which of the two should I prefer to convert a string into a float type Number?
  • is there any difference between the two?
Author: Wallace Maxters, 2020-10-27

2 answers

Has 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

The only difference is the algorithm - parseFloat 're reading the characters in the string until it finds something that it is not recognized as a part of a number, such as the minus sign and the point is the decimal separator in addition to "e" followed by numbers, which is part of the scientific notation, and found only from the part that managed to read. Number does not do this, 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 the 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
 8
Author: hkotsubo, 2020-10-27 18:24:31

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 makes the parse of the argument (converting it to string first, if necessary) and returns a floating point number.

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

The parse may eventually 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:

Note that since Number does type conversion, it can be replaced by the unary operator +, which has the exact same function.

Let's look at some special cases (based on this SOen response ) in example:

  • For any valid numeric input, the output will be the same, since it can be parsed (by 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
    
  • In relation to the numeric literals of the language, parseFloat cannot handle strings that represent them, while Number, yes. This means that Number can convert from literal syntax of binary , octal and hexadecimal (as well as the previously treated decimal):

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

    in the example above, parseFloat returns 0 because it reads the string from left to right until it fails to find valid numeric characters. How b, o and x are invalid, the remainder of the string is ignored after such demarcations.

  • In relation to the literal values of the language, Number does the conversion normally, while parseFloat will always return NaN. For example, when passing booleans:

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

    That's why if you pass an empty string to Number 0 it will be returned.

 5
Author: Luiz Felipe, 2020-10-27 18:36:14