Number.parseFloat() — Methode · JavaScript-Referenz

Signatur

Number.parseFloat(string)

Beschreibung

Number.parseFloat() wandelt das Argument zuerst in eine Zeichenkette um, entfernt führende Leerzeichen und liest dann so viele Zeichen, wie eine gültige Dezimalzahl ergeben. Das können ein Vorzeichen, Ziffern, ein Dezimalpunkt und ein Exponent (e/E) sein, außerdem Infinity. Beim ersten ungültigen Zeichen hört das Parsen auf, der Rest wird ohne Fehlermeldung verworfen. Ist schon das erste Zeichen ungültig, lautet das Ergebnis NaN.

Die Methode ist dieselbe Funktion wie das globale parseFloat() (Number.parseFloat === parseFloat ergibt true). ES2015 hat sie in Number aufgenommen, damit weniger globale Funktionen nötig sind und der Code modularer wird.

Sinnvoll ist sie, wenn eine Zahl am Anfang einer Zeichenkette steht, z. B. bei CSS-Werten wie "12.5px", Messwerten mit Einheit oder Benutzereingaben. Soll die ganze Zeichenkette eine gültige Zahl sein, ist Number() besser geeignet, denn es gibt bei nachfolgendem Text NaN zurück.

Parameter

Name	Typ	Default	Beschreibung
$string Pflicht	string\|any		Der Wert, der geparst wird. Ist er keine Zeichenkette, wird er vorher mit `String()` umgewandelt. Führende Leerzeichen werden ignoriert.

Rückgabewert

Typ

number

Beschreibung

Die geparste Gleitkommazahl, Infinity bzw. -Infinity oder NaN, wenn am Anfang keine gültige Zahl steht.

Beispiele

Grundlegende Umwandlungen

console.log(Number.parseFloat('3.14'));
console.log(Number.parseFloat('  -0.5e2abc'));
console.log(Number.parseFloat('Preis: 5'));
console.log(Number.parseFloat('Infinity'));
console.log(Number.parseFloat('.75'));

3.14 -50 NaN Infinity 0.75

Pixelwert aus einer berechneten CSS-Eigenschaft lesen

const box = document.querySelector('.box');
const width = Number.parseFloat(getComputedStyle(box).width); // z. B. "240.5px"
box.style.width = `${width * 1.5}px`;
console.log(width);

240.5

Benutzereingabe mit Validierung

const parsePrice = (input) => {
  // Deutsches Komma in Punkt umwandeln
  const value = Number.parseFloat(input.trim().replace(',', '.'));
  if (Number.isNaN(value)) {
    throw new Error(`Ungültiger Preis: "${input}"`);
  }
  return value;
};

console.log(parsePrice('19,99'));
console.log(parsePrice('7.5 EUR'));

19.99 7.5

Unterschied zu Number() und parseInt()

const input = '42.7kg';
console.log(Number.parseFloat(input));
console.log(Number.parseInt(input, 10));
console.log(Number(input));
console.log(Number.parseFloat === parseFloat);

42.7 42 NaN true

// Wichtig · Fallstricke

Nachfolgender Text wird ohne Fehlermeldung ignoriert: Number.parseFloat('1.5abc') ergibt 1.5. Für strenge Prüfungen eignet sich Number() zusammen mit Number.isNaN().
Nur der Punkt gilt als Dezimaltrennzeichen: '3,14' ergibt 3. Das Gebietsschema wird nicht beachtet.
Keine Hexadezimal-, Binär- oder Oktalschreibweise: '0x1A' ergibt 0. Tausendertrennzeichen und Unterstriche ('1_000') werden ebenfalls nicht erkannt.
Leere Zeichenkette: Sie ergibt NaN, während Number('') 0 ergibt.
BigInt: Werte wie 123n werden über die Zeichenkette umgewandelt, dabei kann Genauigkeit verloren gehen. Sehr große Zahlen werden auf die nächste darstellbare Gleitkommazahl gerundet.
Objekte werden über toString()/valueOf() umgewandelt. Ein Symbol löst einen TypeError aus.
Kompatibilität: Alle modernen Browser und Node.js unterstützen die Methode. Im Internet Explorer fehlt sie, dort kann man stattdessen das globale parseFloat() nutzen.

Siehe auch

Number.parseInt() Number.isFinite() Number.isNaN() Number.isInteger() Number.isSafeInteger()