JavaScript parseFloat(): Convert Strings to Decimal Numbers

parseFloat() is a global JavaScript function that reads a value as a string and returns a floating-point number. It is useful when form fields, CSS values, CSV columns, or API values arrive as text but your code needs a number for calculations.

The important detail is that parseFloat() reads from the start of the string and stops when it reaches a character that cannot be part of a decimal number. That makes it more flexible than Number(), but also easier to misuse if you expect strict validation.

Tested On: The examples were tested with Node.js v20.18.1 on a Linux system. The same parseFloat() behavior works in modern browsers and JavaScript runtimes.

JavaScript parseFloat Syntax

parseFloat(value)

value is converted to a string first. Leading whitespace is ignored. If the first non-space character cannot start a valid number, the result is NaN.

Method 1: Convert a String to a Decimal Number

Use parseFloat() when a numeric string may contain a decimal part.

const price = parseFloat("42.75");

console.log(price);
console.log(typeof price);

Sample output:

42.75
number

After conversion, JavaScript can use the result in arithmetic as a number instead of treating it as text.

Method 2: Parse a Leading Number from a String

parseFloat() is often used when the number appears at the beginning of a string, such as a CSS value.

console.log("parseFloat-basic:", parseFloat("42.75px"));

Tested output:

parseFloat-basic: 42.75

This works because the string starts with a valid number. The px suffix is ignored after the numeric part is parsed.

Method 3: Check for NaN After Parsing

If a string does not start with a valid number, parseFloat() returns NaN.

const value = parseFloat("price 42");

console.log("parseFloat-invalid:", Number.isNaN(value));

Tested output:

parseFloat-invalid: true

Prefer Number.isNaN() for checking the parsed result. It avoids some of the coercion surprises of the older global isNaN() function.

Method 4: Parse Scientific Notation

parseFloat() supports decimal notation and exponent notation.

console.log("parseFloat-number:", parseFloat("1.25e3"));

Tested output:

parseFloat-number: 1250

This is useful when reading values from data files or APIs that store numbers in scientific notation.

parseFloat vs Number

Use parseFloat() when you want the leading numeric part of a string. Use Number() when the whole string must be a valid number.

console.log(parseFloat("123.45abc"));
console.log(Number("123.45abc"));

Output:

123.45
NaN

For strict validation, Number() is usually better. For extracting a decimal value from a string that starts with a number, parseFloat() is more convenient.

Common Questions About parseFloat in JavaScript

Is parseFloat only for decimal numbers?

No. parseFloat("42") returns 42. JavaScript has one number type for both integer-like and decimal values, but parseFloat() is designed to parse decimal number syntax.

Why does parseFloat return NaN?

It returns NaN when the first non-whitespace character cannot start a number. For example, parseFloat("abc123") returns NaN, while parseFloat("123abc") returns 123.

Should I use parseFloat for money?

Use caution. parseFloat() can convert a string like "19.99", but JavaScript floating-point math can introduce rounding issues. For money calculations, store cents as integers or use a decimal library when precision matters.

Summary

parseFloat() converts strings to JavaScript numbers and is especially useful when a value starts with a decimal number followed by extra text. It ignores leading spaces, supports exponent notation, and returns NaN when no valid leading number exists. For strict conversion, compare it with Number(); for user input and data parsing, always check the result before using it in calculations.

Official Documentation

• MDN parseFloat()