Intl. NumberFormat
Formatuje liczby zgodnie z zasadami danego języka: separatory, waluty, procenty i jednostki.
- Zwraca
- Obiekt formatera z metodą
format()(orazformatToParts()).
Przykład
#const price = new Intl.NumberFormat('pl-PL', { style: 'currency', currency: 'PLN' })
console.log(price.format(49))
console.log(price.format(1299.5))
console.log(new Intl.NumberFormat('pl-PL').format(1234567.891))Definicja i zastosowanie
#Intl.NumberFormat to wbudowany formater liczb, który zna zwyczaje zapisu w różnych językach i krajach. W Polsce część dziesiętną oddziela się przecinkiem, a tysiące spacją, a w USA część dziesiętną oddziela kropka, a tysiące przecinek. Zamiast pisać to ręcznie, tworzysz formater dla wybranego języka i wywołujesz jego metodę format().
Opcja style określa rodzaj liczby: "decimal" (domyślnie), "currency" dla kwot (wymaga waluty, np. currency: "PLN"), "percent" dla procentów (wartość 0.85 da „85%”) i "unit" dla jednostek. Opcje minimumFractionDigits i maximumFractionDigits ustalają liczbę miejsc po przecinku, a notation: "compact" skraca duże liczby, np. do „1,5 tys.”.
Utworzenie formatera trochę kosztuje, więc jeśli formatujesz wiele liczb, utwórz go raz i używaj wielokrotnie. Do jednorazowego użycia wystarczy krótsza metoda liczb toLocaleString(), która przyjmuje te same opcje.
Składnia
#new Intl.NumberFormat(locales)
new Intl.NumberFormat(locales, options)
formatter.format(number)Parametry
#locales
opcjonalny, napis lub tablica
Kod języka, np."pl-PL","en-US"albo"de-DE". Pominięty oznacza język przeglądarki.options
opcjonalny obiekt
Ustawienia, m.in.style,currency,unit,minimumFractionDigits,maximumFractionDigitsinotation.
Więcej przykładów
#const percent = new Intl.NumberFormat('pl-PL', { style: 'percent' })
const twoDigits = new Intl.NumberFormat('pl-PL', {
minimumFractionDigits: 2,
maximumFractionDigits: 2
})
console.log(percent.format(0.85))
console.log(twoDigits.format(3.14159))
console.log(twoDigits.format(7))const amount = 1234.5
console.log(new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(amount))
console.log(new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(amount))
console.log(amount.toLocaleString('pl-PL', { style: 'currency', currency: 'PLN' }))const compact = new Intl.NumberFormat('pl-PL', { notation: 'compact' })
console.log(compact.format(1500))
console.log(compact.format(2500000))Obsługa przeglądarek
#Szeroko dostępne
Działa we wszystkich nowoczesnych przeglądarkach, także na telefonach. Możesz używać bez obaw.
- Chrome
- Edge
- Firefox
- Safari
Dobre praktyki
#- W języku polskim liczby czterocyfrowe nie mają separatora tysięcy („1234”), a pięciocyfrowe już tak („12 345”). To nie błąd, tylko polska norma.
- Formater wstawia spacje niełamiące (
\u00a0), a nie zwykłe. Porównując wynik w testach, porównuj go z wynikiem tego samego formatera albo uwzględnij ten znak. - Utwórz formater raz, poza pętlą, i używaj go wielokrotnie. Dla pojedynczej liczby wystarczy
liczba.toLocaleString("pl-PL").
Powiązane hasła
#- Intl.DateTimeFormatFormatuje daty i godziny zgodnie z zasadami wybranego języka i strefy czasowej.
- Number.prototype.toFixed()Zamienia liczbę na napis z podaną liczbą miejsc po przecinku.
- Math.round()Zaokrągla liczbę do najbliższej liczby całkowitej.
- DateObiekt reprezentujący konkretny moment w czasie, z metodami do odczytu i zmiany daty oraz godziny.
- Number.prototype.toLocaleString()Formatuje liczbę według zwyczajów wybranego języka: separatory tysięcy, przecinek, waluty i procenty.
- Intl.PluralRulesWybiera właściwą odmianę słowa po liczebniku w danym języku. Po polsku: 1 punkt, 2 punkty, 5 punktów.
Widzisz błąd albo brakuje przykładu? Napisz do nas.