Zahlen Formatierung Online

Zahlen Formatieren Online — Tausendertrennzeichen, Währung & Intl.NumberFormat Code

Füge eine Zahl ein und sieh sofort, wie sie als Währung, Dezimalzahl oder Prozentsatz für jeden Locale der Welt formatiert aussieht. Ob du Tausendertrennzeichen zu einer großen Zahl hinzufügen, einen Preis in Euro korrekt darstellen oder den exakten JavaScript-Code generieren möchtest, der das Ergebnis in deiner App reproduziert — dieses Tool deckt alle drei Fälle ab.

Anders als generische Formatierer, die nur Tausendertrennzeichen hinzufügen, setzt dieses Tool die volle Leistung der nativen Intl.NumberFormat-API des Browsers ein: Wähle Locale, Währung, minimale und maximale Dezimalstellen sowie das Gruppenverhalten. Der Code-Snippet aktualisiert sich in Echtzeit, damit du ihn direkt in dein Projekt einfügen kannst.

So verwendest du den Zahlenformatierer

Eine Zahl zu formatieren dauert Sekunden:

1. Zahl eingeben in der Schnellmodus-Leiste oben — das Ergebnis erscheint sofort mit Tausendertrennzeichen in deinem Locale und wandelt 1250500,75 in 1.250.500,75 (de-DE) oder 1,250,500.75 (en-US) um, während du tippst.
2. Format konfigurieren im Bereich Technische Konfiguration — Locale auswählen, Formatierungsstil (Währung, Dezimal oder Prozent) wählen, Währungscode festlegen und Dezimalstellen einstellen. Das Ergebnis aktualisiert sich live.
3. Ergebnis oder Code kopieren — "Ergebnis kopieren" für die formatierte Zeichenkette, oder "Code kopieren" für den fertigen Intl.NumberFormat-JavaScript-Snippet mit deiner genauen Konfiguration.

Beispiele zur Zahlenformatierung

So sieht dieselbe Zahl in verschiedenen Konfigurationen aus:

Die Indien-Zeile zeigt einen entscheidenden Unterschied: ₹12,50,500.75 verwendet Zweierstellen nach den ersten drei Stellen, entsprechend dem südostasiatischen Lakh-Crore-System. Konventionelle Formatierer reproduzieren dies nicht korrekt. Der Locale hi-IN löst dies nativ über Intl.NumberFormat.

Die Schweiz überrascht ebenfalls: CHF 1'250'500.75 verwendet Apostrophe als Tausendertrennzeichen — eine Besonderheit, die kein handgemachtes Regex korrekt abbilden würde.

Intl.NumberFormat — Der JavaScript-Standard für Zahlenformatierung

Intl.NumberFormat ist die native JavaScript-API für lokalisierungsbewusste Zahlenformatierung. Alle modernen Browser und Node.js unterstützen sie ohne externe Abhängigkeiten:

new Intl.NumberFormat('de-DE', {
  style: 'currency',
  currency: 'EUR',
  minimumFractionDigits: 2,
}).format(1250500.75);
// → "1.250.500,75 €"

Der Konstruktor nimmt ein BCP-47-Sprach-Tag (wie de-DE, en-US oder hi-IN) und ein Optionsobjekt entgegen. Die Eigenschaft style steuert, ob die Zahl als Währungszeichenkette, Dezimalzahl oder Prozentwert dargestellt wird. useGrouping: false entfernt alle Trennzeichen — nützlich für API-Payloads, bei denen du eine reine Zahlenzeichenkette benötigst.

Häufige Anwendungsfälle

• E-Commerce-Preisanzeige: Denselben Datenbankpreis für jeden Locale des Shops formatieren — 12,99 wird zu €11,99, $12.99 oder R$ 12,99, je nach Land des Kunden.
• Finanz-Dashboards: Portfolio-Werte, Umsatzzahlen und Marktkapitalisierung mit korrekten Tausendertrennzeichen anzeigen, damit 1250000 auf einen Blick als 1.250.000 gelesen wird.
• Tausendertrennzeichen zu einer Zahl hinzufügen: Der häufigste Schnelleinsatz — die Schnellmodus-Leiste oben ist genau dafür gebaut.
• Rechnungen und Berichte: Lokalisierte Zeichenketten für Dokumente generieren, die an Kunden in anderen Ländern gehen.
• Lernen und Prototyping: Testen, wie verschiedene Intl.NumberFormat-Optionskombinationen zusammenwirken, bevor eine Konfiguration in der Produktion festgelegt wird.

Häufig gestellte Fragen

Wie füge ich Tausendertrennzeichen zu einer Zahl in JavaScript hinzu?

Nutze Intl.NumberFormat mit dem Stil decimal und useGrouping: true (Standard): new Intl.NumberFormat('de-DE').format(1250500) gibt "1.250.500" zurück. Für den US-amerikanischen Locale tausche gegen 'en-US' aus — dort werden Kommas als Tausendertrennzeichen und Punkte als Dezimaltrennzeichen verwendet. Dieses Tool generiert den Code-Snippet für jede Konfiguration.

Was bewirkt minimumFractionDigits in Intl.NumberFormat?

minimumFractionDigits legt die Mindestanzahl an Dezimalstellen fest — die formatierte Zahl zeigt immer mindestens diese Anzahl nach dem Komma. Den Wert auf 2 zu setzen stellt sicher, dass 1250500 als 1.250.500,00 € und nicht als 1.250.500 € erscheint. maximumFractionDigits ist die Obergrenze. Wenn beide auf 2 gesetzt sind, zeigt die Zahl immer genau zwei Dezimalstellen.

Unterstützt Intl.NumberFormat das indische Lakh-Crore-System?

Ja. Der Locale hi-IN implementiert das indische Nummerierungssystem nativ: Gruppen von zwei Stellen nach den ersten drei, was ₹12,50,500.75 für 1.250.500,75 ergibt. Keine zusätzliche Logik ist erforderlich — es ist Teil des Unicode-CLDR-Standards, den Browser implementieren.

Was ist der Unterschied zwischen dem Prozentstil und einer Multiplikation mit 100?

Intl.NumberFormat mit style: 'percent' behandelt den Eingabewert als Bruchteil, nicht als Prozentwert — er multipliziert intern mit 100. Übergib 0.45, um "45 %" zu erhalten, nicht 45. Wenn dein Wert bereits als Prozentzahl vorliegt (z. B. 45), teile ihn vor der Formatierung durch 100: formatter.format(45 / 100).

Wie formatiere ich Zahlen für verschiedene Länder ohne die Währung zu ändern?

Verwende den Locale-Selektor in der Technischen Konfiguration, um den Anzeige-Locale unabhängig vom Währungscode zu überschreiben. So kannst du beispielsweise einen EUR-Betrag mit den Konventionen des Locale en-US anzeigen und erhältst €1,250,500.75 statt 1.250.500,75 €.

Ressourcen

• MDN — Intl.NumberFormat — Offizielle Referenz mit allen Konstruktoroptionen und Browser-Kompatibilitätstabelle.
• Unicode CLDR — Zahlenformate — Die Daten, die Browser für Trennzeichen, Währungssymbole und regionale Formatierung verwenden.