Number.parseFloat()
Number.parseFloat(string) Number.parseFloat() parses a string argument and returns a floating-point Number. It is the ES6-namespaced twin of the global parseFloat() — they are the same function reference:
Number.parseFloat === parseFloat; // true
The Number. prefix exists purely for modularization of globals, a pattern ES6 applied to parseInt, parseFloat, and several other top-level functions so code can opt into a namespaced style without behavior change. Pick whichever reads better; modern codebases tend to prefer the Number. form to pair naturally with Number.isNaN() and Number.isFinite().
Syntax
Number.parseFloat(string)
Parameters
string (any): The value to parse. Non-string values are coerced to a string first using the standard String(value) rule. Leading whitespace in the resulting string is ignored.
Return Value
A Number parsed from the longest valid numeric prefix of the string. If no prefix matches a valid numeric literal, the function returns NaN.
The grammar Number.parseFloat accepts is a subset of what the Number() constructor accepts:
- Sign
+/-allowed at the start, or after an exponent indicator. - Decimal digits
0–9, a single decimal point., and one exponente/E(with at least one digit before it). - The literal
Infinity/-Infinityparses toInfinity/-Infinity. - No non-decimal prefixes (
0x,0b,0o) are recognized. - Trailing invalid characters stop parsing but are silently dropped — the prefix is still returned as a number.
How Number.parseFloat() parses strings
Number.parseFloat walks the string from left to right and consumes as many characters as it can while the prefix still looks numeric. The moment it hits a character that cannot be part of a decimal literal, it stops and returns the number it has read so far. An empty prefix means NaN. A pure numeric string means the parsed value. A mixed string like "100.5abc" means the parsed prefix (100.5) with the trailing junk silently dropped.
// Walk-and-return-prefix in one expression
const parse = (s) => {
const n = Number.parseFloat(s);
return Number.isNaN(n) ? "no number" : n;
};
parse("3.14"); // 3.14
parse("3.14abc"); // 3.14
parse("abc3.14"); // "no number"
parse(""); // "no number"
This walk-and-stop behavior is what distinguishes Number.parseFloat from Number() (strict, returns NaN on any trailing junk) and from parseInt() (which truncates at the decimal point instead of keeping the fractional part). If you need either of those, use the right tool for the job; the parser here is intentionally the most forgiving of the three.
Examples
Basic parsing
The simplest cases show Number.parseFloat reading numeric text and stripping the whitespace around it. Non-string inputs are coerced through String() first, which is why a raw number literal still works without explicit conversion on your part.
Number.parseFloat("3.14");
// 3.14
Number.parseFloat(" 2.718 ");
// 2.718 (leading whitespace ignored)
Number.parseFloat(42);
// 42 (number is coerced to string first)
Scientific notation
When numbers are written in scientific notation, like small values, large magnitudes, or anything that looks like 1e10, Number.parseFloat reads the mantissa and exponent together and returns the same decimal value the literal would represent if you typed it out by hand.
Number.parseFloat("314e-2");
// 3.14
Number.parseFloat("0.0314E+2");
// 3.14
Infinity and out-of-range values
Values that exceed the floating-point range are not errors here. They collapse to ±Infinity the same way arithmetic does. That is the behavior you want from a parser, but it does mean a parse “succeeded” even when the original magnitude was unrepresentable in IEEE 754.
Number.parseFloat("Infinity");
// Infinity
Number.parseFloat("-Infinity");
// -Infinity
Number.parseFloat("1.8e308");
// Infinity (above Number.MAX_VALUE)
Trailing garbage is ignored
This is the most important behavior difference from Number(). Number.parseFloat returns the longest still-valid prefix it can find; Number() returns NaN for the same input because it requires the whole string to match:
Number.parseFloat("100.5abc");
// 100.5
Number("100.5abc");
// NaN
That leniency is the reason parseFloat is the go-to choice when the source text is messy or partially numeric. Anywhere the first number is the only thing that matters (CSS values, version strings, log lines, user input), Number.parseFloat does the right thing without you writing a custom regex.
Non-decimal prefixes are not supported
Number.parseFloat("0x1A");
// 0 (stops at the "x" — hex prefix is ignored)
Number.parseFloat("0b10");
// 0
Number.parseFloat("0o10");
// 0
If you specifically need hex, binary, or octal parsing, reach for Number('0x1A') (which returns 26) or parseInt(string, 16). The trade-off is that those parsers stop at the first non-digit in the input, ignoring trailing units the same way Number.parseFloat does, so the prefix-leniency is shared.
NaN cases
Number.parseFloat returns NaN whenever the string starts with a character that cannot begin a numeric literal: letters other than e or E, the empty string, or values like true/false/null that do not coerce to a numeric shape. The rule of thumb is: a leading non-numeric character means no parse, full stop.
Number.parseFloat("FF2");
// NaN (no parseable number starts with "F")
Number.parseFloat("NaN");
// NaN (the string "NaN" is not a valid parseFloat literal)
Number.parseFloat("");
// NaN
Number.parseFloat(true);
// NaN (coerced from "true")
Practical: parse a CSS length value
A common use case is pulling a number out of a CSS length string like 14px or 1.5em. The function reads the numeric prefix, leaves the unit behind, and a Number.isNaN check cleanly handles values that contain no number at all (auto, inherit, or any other CSS keyword that does not begin with a digit).
function pxToNumber(value) {
const n = Number.parseFloat(value);
return Number.isNaN(n) ? 0 : n;
}
pxToNumber("14px"); // 14
pxToNumber("1.5em"); // 1.5
pxToNumber("auto"); // 0
Practical: sum numeric strings, skip junk
Another common pattern is summing user-entered numeric strings while silently skipping rows that did not parse. Pairing Number.parseFloat with Number.isNaN inside a reduce keeps the running total correct without throwing on bad input.
const totals = ["1.5", "2.25", "3.0", "oops"].reduce((sum, s) => {
const n = Number.parseFloat(s);
return Number.isNaN(n) ? sum : sum + n;
}, 0);
// 6.75
Number.parseFloat() vs Number() vs parseInt()
A quick reference for the three parsers on common inputs:
| Input | Number.parseFloat(input) | Number(input) | parseInt(input) |
|---|---|---|---|
"3.14" | 3.14 | 3.14 | 3 |
"3.14abc" | 3.14 (lenient) | NaN (strict) | 3 |
" 42 " | 42 | 42 | 42 |
"" | NaN | 0 | NaN |
"0x1A" | 0 | 26 | 26 |
"Infinity" | Infinity | Infinity | NaN |
true | NaN | 1 | NaN |
[1] | 1 (from "1") | 1 | 1 |
Reach for Number.parseFloat when you want lenient, decimal-only parsing of mixed strings. Reach for Number() when you want strict conversion that rejects anything not a clean numeric literal. Reach for parseInt when you specifically need an integer.
Common Pitfalls
- Trailing junk is accepted.
Number.parseFloat("3.14xyz")returns3.14, notNaN. If the rest of the string matters, validate it yourself or useNumber(). - No hex, binary, or octal prefixes.
"0xFF"parses to0. Pass a radix toparseIntor useNumber()if you need those bases. - BigInts lose precision.
Number.parseFloat(900719925474099267n)returns900719925474099300(the trailingnhalts parsing, and the value is then re-coerced). UseNumber(bigintValue)to preserve the value. - Comma decimal separators fail. Locale-formatted numbers like
"1,5"parse to1. Normalize","to"."first if you are parsing European-style input. - Object inputs go through
toString().Number.parseFloat({ toString() { return "2.5"; } })returns2.5. This is rarely what you want — check the input type before parsing. - Out-of-range values collapse silently to
±Infinity. There is no error thrown; check withNumber.isFinite()if the magnitude matters.
Browser Support
Number.parseFloat is widely available across all major browsers since September 2015. For older runtimes, the polyfill is a one-liner:
if (!Number.parseFloat) Number.parseFloat = parseFloat;
Conclusion
Number.parseFloat() is the lenient, decimal-only parser in the Number namespace. It returns the longest numeric prefix of its input, ignores trailing junk, and refuses anything that does not start with a sign, digit, or decimal point. Use it whenever the source text is messy and the first number is the only thing that matters; reach for Number() when you need strictness, or parseInt() when you need an integer.
See Also
- parseFloat(): the global twin, identical behavior
- Number.isNaN(): pair it with
Number.parseFloatto detect parse failures - Number.isFinite(): guard against
Infinityresults from out-of-range input