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.
Environment: Node.js v20.18.2. After each runnable snippet, the following paragraph states the expected console output (order and values).
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:
You should see 2 lines, in order: 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 from getComputedStyle—see get width of an element in JavaScript for reading computed dimensions before you parse them.
console.log("parseFloat-basic:", parseFloat("42.75px"));You should see one line logging 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));You should see one line logging 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"));You should see one line logging 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"));You should see 2 lines, in order: 123.45, NaN.
For strict validation when the whole string must be numeric, see check if string is number in JavaScript (Number() plus Number.isFinite). For extracting a decimal prefix from text such as 123.45abc or 42.75px, 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. To format a parsed value for display, pair with JavaScript toFixed()—remember toFixed() returns a string.
