ToLocaleString: примеры (JAVASCRIPT)

JavaScript toLocaleString: практическое применение и примеры
Раздел: Объекты, Преобразование
toLocaleString(locales?, options?): string

Основы функции toLocaleString

Метод toLocaleString() возвращает строковое представление объекта с учетом региональных настроек. Этот метод доступен для объектов Number, Date и Array в JavaScript.

Использование:

Функция применяется для форматирования значений согласно правилам конкретного языка и региона. Это важно в международных приложениях, где необходимо отображать числа, даты и списки в привычном для пользователя формате.

Аргументы:

  • locales (необязательный) - строка или массив строк с тегом языка BCP 47
  • options (необязательный) - объект с настройками форматирования

Возвращаемое значение:

Строка, представляющая объект с учетом переданных локалей и опций.

Базовые примеры использования

Форматирование чисел:

const num = 1234567.89;
console.log(num.toLocaleString('ru-RU'));
console.log(num.toLocaleString('en-US'));
console.log(num.toLocaleString('de-DE'));
1 234 567,89
1,234,567.89
1.234.567,89

Форматирование дат:

const date = new Date('2024-01-15');
console.log(date.toLocaleString('ru-RU'));
console.log(date.toLocaleString('en-US'));
console.log(date.toLocaleString('ja-JP'));
15.01.2024, 03:00:00
1/15/2024, 3:00:00 AM
2024/1/15 3:00:00

Форматирование массива:

const arr = [4500, 2100, 7800];
console.log(arr.toLocaleString('ru-RU'));
4 500, 2 100, 7 800

Альтернативные функции в JavaScript

Intl.NumberFormat предоставляет более детальный контроль над форматированием чисел и поддерживает кэширование форматеров для производительности.

const formatter = new Intl.NumberFormat('ru-RU');
console.log(formatter.format(1234567.89));
1 234 567,89

Intl.DateTimeFormat аналогично специализируется на форматировании дат с расширенными возможностями.

const dateFormatter = new Intl.DateTimeFormat('ru-RU');
console.log(dateFormatter.format(new Date()));
15.01.2024

toString() используется для простого строкового представления без учета локали.

Аналоги в других языках программирования

Python:

import locale
locale.setlocale(locale.LC_ALL, 'ru_RU.UTF-8')
print(locale.format_string('%.2f', 1234567.89, grouping=True))
1 234 567,89

PHP:

$number = 1234567.89;
setlocale(LC_ALL, 'ru_RU.UTF-8');
echo number_format($number, 2);
1,234,567.89

MySQL:

SELECT FORMAT(1234567.89, 2, 'ru_RU');
1 234 567,89

C#:

double value = 1234567.89;
Console.WriteLine(value.ToString("N", new CultureInfo("ru-RU")));
1 234 567,89

Типичные ошибки и проблемы

Неподдерживаемая локаль:

console.log((1000).toLocaleString('xx-XX'));
1000

Функция возвращает значение без форматирования при неизвестной локали.

Несоответствие типов:

const obj = {value: 1000};
console.log(obj.toLocaleString('ru-RU'));
[object Object]

Метод доступен только для определенных типов объектов.

Некорректные опции:

console.log((1000).toLocaleString('ru-RU', {style: 'invalid'}));
RangeError: Invalid value for option style

Изменения в современных версиях

В ECMAScript 2021 добавлена поддержка числовых разделителей для опции useGrouping. В более ранних версиях JavaScript были введены дополнительные опции для форматирования единиц измерения и компактного представления чисел.

Обновление спецификации Intl.NumberFormat в ES2020 добавило поддержку форматирования единиц измерения (миллиметры, килограммы и т.д.).

console.log((1000).toLocaleString('ru-RU', {
  style: 'unit',
  unit: 'meter',
  unitDisplay: 'long'
}));
1 000 метров

Расширенные примеры применения

Форматирование валют с разными стилями:

Пример javascript
const price = 1234.56;
console.log(price.toLocaleString('ru-RU', {
  style: 'currency',
  currency: 'RUB',
  currencyDisplay: 'symbol'
}));
console.log(price.toLocaleString('en-US', {
  style: 'currency',
  currency: 'USD',
  minimumFractionDigits: 0
}));
1 234,56 ₽
$1,235

Процентное форматирование:

Пример javascript
console.log((0.456).toLocaleString('ru-RU', {
  style: 'percent',
  minimumFractionDigits: 1
}));
45,6 %

Научная нотация:

Пример javascript
console.log((123456789).toLocaleString('ru-RU', {
  notation: 'scientific'
}));
1,235E8

Компактное представление:

Пример javascript
console.log((1234567).toLocaleString('ru-RU', {
  notation: 'compact',
  compactDisplay: 'short'
}));
1,2 млн

Форматирование с точностью:

Пример javascript
console.log((1234.5678).toLocaleString('ru-RU', {
  minimumFractionDigits: 2,
  maximumFractionDigits: 3
}));
1 234,568

Кастомное форматирование времени:

Пример javascript
const now = new Date();
console.log(now.toLocaleString('ru-RU', {
  hour12: false,
  year: 'numeric',
  month: 'long',
  day: 'numeric',
  hour: '2-digit',
  minute: '2-digit'
}));
15 января 2024 г., 14:30

Массивы с разными типами данных:

Пример javascript
const mixedArray = [new Date(), 1500.75, 0.85];
console.log(mixedArray.toLocaleString('ru-RU', {
  style: 'percent',
  minimumFractionDigits: 1
}));
15.01.2024, 03:00:00, 1 500,75, 85,0 %

JS toLocaleString function comments

En
ToLocaleString Returns a string with a language sensitive representation of the number/date/array