Intl.NumberFormat
Об'єкт Intl.NumberFormat
(інтернаціоналізація – формат чисел) дає змогу форматувати числа з урахуванням мови.
Спробуйте його в дії
Конструктор
Intl.NumberFormat()
Створює новий об'єкт
NumberFormat
.
Статичні методи
Intl.NumberFormat.supportedLocalesOf()
Повертає масив, що містить ті з переданих локалей, котрі підтримуються без потреби відступати до усталеної локалі середовища виконання.
Властивості примірника
Ці властивості означені на Intl.NumberFormat.prototype
і спільні для всіх примірників Intl.NumberFormat
.
Intl.NumberFormat.prototype.constructor
Функція-конструктор, котра створила цей об'єкт-примірник. Для примірників
Intl.NumberFormat
початковим значенням є конструкторIntl.NumberFormat
.Intl.NumberFormat.prototype[Symbol.toStringTag]
Початковим значенням властивості
Symbol.toStringTag
є рядок"Intl.NumberFormat"
. Ця властивість використовується вObject.prototype.toString()
.
Методи примірника
Intl.NumberFormat.prototype.format()
Функція-гетер, котра форматує число згідно з локаллю та опціями форматування цього об'єкта
Intl.NumberFormat
.Intl.NumberFormat.prototype.formatRange()
Функція-гетер, котра форматує діапазон чисел згідно з локаллю та опціями форматування об'єкта
Intl.NumberFormat
, з якого цей метод викликано.Intl.NumberFormat.prototype.formatRangeToParts()
Повертає
Array
з об'єктів, що представляють діапазон числових рядків у вигляді частин, що можуть бути використані для виконання власного форматування з урахуванням локалі.Intl.NumberFormat.prototype.formatToParts()
Повертає
Array
з об'єктів, котрі представляють числовий рядок у вигляді частин, що може використовуватися для виконання власного форматування з урахуванням локалі.Intl.NumberFormat.prototype.resolvedOptions()
Повертає новий об'єкт з властивостями, що відбивають локаль та опції порівняння, обчислені під час ініціалізації цього об'єкта.
Приклади
Базове застосування
При базовому застосуванні, без задання локалі, повертається рядок, форматований згідно з усталеними локаллю та опціями.
const number = 3500;
console.log(new Intl.NumberFormat().format(number));
// '3,500', коли в локалі англійської мови в США
Застосування локалей
Цей приклад демонструє частину варіацій форматів локалізованих чисел. Для отримання формату мови, котра використовується в користувацькому інтерфейсі застосунку, слід обов'язково задати цю мову (і бажано – якісь запасні мови) за допомогою аргументу locales
:
const number = 123456.789;
// Німецька використовує кому як десятковий розділювач і крапку як розділювач груп розрядів
console.log(new Intl.NumberFormat("de-DE").format(number));
// 123.456,789
// Арабська у більшості арабськомовних країн застосовує справжні арабські цифри
console.log(new Intl.NumberFormat("ar-EG").format(number));
// ١٢٣٤٥٦٫٧٨٩
// Індія використовує розділювач груп розрядів, а також лакх і крор
console.log(new Intl.NumberFormat("en-IN").format(number));
// 1,23,456.789
// ключ розширення nu задає систему числення, наприклад, китайські цифри
console.log(new Intl.NumberFormat("zh-Hans-CN-u-nu-hanidec").format(number));
// 一二三,四五六.七八九
// при заданні мови, котра може не підтримуватися, як то
// балійської, слід задати запасну мову, в цьому випадку це індонезійська
console.log(new Intl.NumberFormat(["ban", "id"]).format(number));
// 123.456,789
Використання опцій
Результати можуть бути налаштовані за допомогою аргументу options
:
const number = 123456.789;
// задання формату валюти
console.log(
new Intl.NumberFormat("de-DE", { style: "currency", currency: "EUR" }).format(
number,
),
);
// 123.456,79 €
// Японська єна не використовує дробових значень
console.log(
new Intl.NumberFormat("ja-JP", { style: "currency", currency: "JPY" }).format(
number,
),
);
// ¥123,457
// обмеження до трьох знаків після коми
console.log(
new Intl.NumberFormat("en-IN", { maximumSignificantDigits: 3 }).format(
number,
),
);
// 1,23,000
// Форматування з одиницями вимірювання
console.log(
new Intl.NumberFormat("pt-PT", {
style: "unit",
unit: "kilometer-per-hour",
}).format(50),
);
// 50 km/h
console.log(
(16).toLocaleString("en-GB", {
style: "unit",
unit: "liter",
unitDisplay: "long",
}),
);
// 16 litres
Вичерпний список опцій доступний на сторінці конструктора Intl.NumberFormat()
.
Специфікації
Специфікація |
---|
ECMAScript Internationalization API Specification (ECMAScript Internationalization API) # numberformat-objects |
Сумісність із браузерами
desktop | mobile | server | ||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
NumberFormat
|
Chrome Full support 24 | Edge Full support 12 | Firefox Full support 29 | Internet Explorer Full support 11 | Opera Full support 15 | Safari Full support 10 | WebView Android Full support 4.4 | Chrome Android Full support 25 | Firefox for Android Full support 56 | Opera Android Full support 14 | Safari on iOS Full support 10 | Samsung Internet Full support 1.5 | Deno Full support 1.8 | Node.js Full support 0.12.0 |
NumberFormat() constructor
|
Chrome Full support 24 | Edge Full support 12 | Firefox Full support 29 | Internet Explorer Full support 11 | Opera Full support 15 | Safari Full support 10 | WebView Android Full support 4.4 | Chrome Android Full support 25 | Firefox for Android Full support 56 | Opera Android Full support 14 | Safari on iOS Full support 10 | Samsung Internet Full support 1.5 | Deno Full support 1.8 | Node.js Full support 13.0.0 |
options.compactDisplay parameter
|
Chrome Full support 77 | Edge Full support 79 | Firefox Full support 78 | Internet Explorer No support Ні | Opera Full support 64 | Safari Full support 14.1 | WebView Android Full support 77 | Chrome Android Full support 77 | Firefox for Android Full support 79 | Opera Android Full support 55 | Safari on iOS Full support 14.5 | Samsung Internet Full support 12.0 | Deno Full support 1.8 | Node.js Full support 12.11.0 |
options.currencyDisplay parameter
|
Chrome Full support 77 | Edge Full support 79 | Firefox Full support 78 | Internet Explorer No support Ні | Opera Full support 64 | Safari Full support 14.1 | WebView Android Full support 77 | Chrome Android Full support 77 | Firefox for Android Full support 79 | Opera Android Full support 55 | Safari on iOS Full support 14.5 | Samsung Internet Full support 12.0 | Deno Full support 1.8 | Node.js Full support 12.11.0 |
options.currencySign parameter
|
Chrome Full support 77 | Edge Full support 79 | Firefox Full support 78 | Internet Explorer No support Ні | Opera Full support 64 | Safari Full support 14.1 | WebView Android Full support 77 | Chrome Android Full support 77 | Firefox for Android Full support 79 | Opera Android Full support 55 | Safari on iOS Full support 14.5 | Samsung Internet Full support 12.0 | Deno Full support 1.8 | Node.js Full support 12.11.0 |
options.notation parameter
|
Chrome Full support 77 | Edge Full support 79 | Firefox Full support 78 | Internet Explorer No support Ні | Opera Full support 64 | Safari Full support 14.1 | WebView Android Full support 77 | Chrome Android Full support 77 | Firefox for Android Full support 79 | Opera Android Full support 55 | Safari on iOS Full support 14.5 | Samsung Internet Full support 12.0 | Deno Full support 1.8 | Node.js Full support 12.11.0 |
options.signDisplay parameter
|
Chrome Full support 77 | Edge Full support 79 | Firefox Full support 78 | Internet Explorer No support Ні | Opera Full support 64 | Safari Full support 14.1 | WebView Android Full support 77 | Chrome Android Full support 77 | Firefox for Android Full support 79 | Opera Android Full support 55 | Safari on iOS Full support 14.5 | Samsung Internet Full support 12.0 | Deno Full support 1.8 | Node.js Full support 12.11.0 |
negative value
|
Chrome No support Ні | Edge No support Ні | Firefox Full support 93 | Internet Explorer No support Ні | Opera No support Ні | Safari No support Ні | WebView Android No support Ні | Chrome Android No support Ні | Firefox for Android Full support 93 | Opera Android No support Ні | Safari on iOS No support Ні | Samsung Internet No support Ні | Deno No support Ні | Node.js No support Ні |
options.unitDisplay parameter
|
Chrome Full support 77 | Edge Full support 79 | Firefox Full support 78 | Internet Explorer No support Ні | Opera Full support 64 | Safari Full support 14.1 | WebView Android Full support 77 | Chrome Android Full support 77 | Firefox for Android Full support 79 | Opera Android Full support 55 | Safari on iOS Full support 14.5 | Samsung Internet Full support 12.0 | Deno Full support 1.8 | Node.js Full support 12.11.0 |
options.unit parameter
|
Chrome Full support 77 | Edge Full support 79 | Firefox Full support 78 | Internet Explorer No support Ні | Opera Full support 64 | Safari Full support 14.1 | WebView Android Full support 77 | Chrome Android Full support 77 | Firefox for Android Full support 79 | Opera Android Full support 55 | Safari on iOS Full support 14.5 | Samsung Internet Full support 12.0 | Deno Full support 1.8 | Node.js Full support 12.11.0 |
format
|
Chrome Full support 24 | Edge Full support 12 | Firefox Full support 29 | Internet Explorer Full support 11 | Opera Full support 15 | Safari Full support 10 | WebView Android Full support 4.4 | Chrome Android Full support 25 | Firefox for Android Full support 56 | Opera Android Full support 14 | Safari on iOS Full support 10 | Samsung Internet Full support 1.5 | Deno Full support 1.8 | Node.js Full support 0.12.0 |
formatRange
|
Chrome No support Ні | Edge No support Ні | Firefox No support Ні | Internet Explorer No support Ні | Opera No support Ні | Safari Full support 15.4 | WebView Android No support Ні | Chrome Android No support Ні | Firefox for Android No support Ні | Opera Android No support Ні | Safari on iOS Full support 15.4 | Samsung Internet No support Ні | Deno No support Ні | Node.js No support Ні |
formatRangeToParts
|
Chrome No support Ні | Edge No support Ні | Firefox No support Ні | Internet Explorer No support Ні | Opera No support Ні | Safari Full support 15.4 | WebView Android No support Ні | Chrome Android No support Ні | Firefox for Android No support Ні | Opera Android No support Ні | Safari on iOS Full support 15.4 | Samsung Internet No support Ні | Deno No support Ні | Node.js No support Ні |
formatToParts
|
Chrome Full support 64 | Edge Full support 12 | Firefox Full support 58 | Internet Explorer No support Ні | Opera Full support 51 | Safari Full support 13 | WebView Android Full support 64 | Chrome Android Full support 64 | Firefox for Android Full support 58 | Opera Android Full support 47 | Safari on iOS Full support 13 | Samsung Internet Full support 9.0 | Deno Full support 1.8 | Node.js Full support 10.0.0 |
resolvedOptions
|
Chrome Full support 24 | Edge Full support 12 | Firefox Full support 29 | Internet Explorer Full support 11 | Opera Full support 15 | Safari Full support 10 | WebView Android Full support 4.4 | Chrome Android Full support 25 | Firefox for Android Full support 56 | Opera Android Full support 14 | Safari on iOS Full support 10 | Samsung Internet Full support 1.5 | Deno Full support 1.8 | Node.js Full support 0.12.0 |
supportedLocalesOf
|
Chrome Full support 24 | Edge Full support 12 | Firefox Full support 29 | Internet Explorer Full support 11 | Opera Full support 15 | Safari Full support 10 | WebView Android Full support 4.4 | Chrome Android Full support 25 | Firefox for Android Full support 56 | Opera Android Full support 14 | Safari on iOS Full support 10 | Samsung Internet Full support 1.5 | Deno Full support 1.8 | Node.js Full support 13.0.0 |