Learn JavaScript

toLocaleString() - метод для форматирования числа по локали в JavaScript

toLocaleString() форматирует число с учётом локали.

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

Синтаксис

number.toLocaleString()
number.toLocaleString(locales)
number.toLocaleString(locales, options)
  • number - число
  • locales - локаль или список локалей, например "ru-RU" или "en-US"
  • options - дополнительные настройки форматирования

Что делает toLocaleString()

Метод превращает число в строку и форматирует её по правилам выбранной локали.

console.log((1234567.89).toLocaleString("en-US")); // "1,234,567.89"
console.log((1234567.89).toLocaleString("ru-RU")); // "1 234 567,89"
console.log((1234567.89).toLocaleString("de-DE")); // "1.234.567,89"

Главное отличие здесь не в самом числе, а в том, как оно показывается.

Что возвращает toLocaleString()

toLocaleString() возвращает строку.

const result = (1234.56).toLocaleString("ru-RU");

console.log(result);        // "1 234,56"
console.log(typeof result); // "string"

Это важно помнить: метод форматирует значение для вывода, а не для дальнейших вычислений.

Без аргументов

Если вызвать toLocaleString() без аргументов, будет использована локаль окружения.

console.log((1234567.89).toLocaleString());

Из-за этого результат может отличаться на разных компьютерах, в браузерах и окружениях.

Форматирование валюты

Один из самых частых сценариев - вывод денег.

console.log(
  (1234.56).toLocaleString("ru-RU", {
    style: "currency",
    currency: "RUB",
  })
); // "1 234,56 ₽"

Ещё пример:

console.log(
  (1234.56).toLocaleString("en-US", {
    style: "currency",
    currency: "USD",
  })
); // "$1,234.56"

Форматирование процентов

Метод умеет форматировать и проценты.

console.log(
  (0.123).toLocaleString("ru-RU", {
    style: "percent",
    maximumFractionDigits: 1,
  })
); // "12,3 %"

Это полезно для интерфейсов, статистики и отчётов.

options для дробной части

Через options можно управлять количеством знаков после запятой.

console.log(
  (1234.5).toLocaleString("ru-RU", {
    minimumFractionDigits: 2,
    maximumFractionDigits: 2,
  })
); // "1 234,50"

Это удобно, когда нужно одинаковое форматирование для таблиц, цен и сумм.

toLocaleString() и toString()

Эти методы решают разные задачи.

console.log((1234567.89).toString());           // "1234567.89"
console.log((1234567.89).toLocaleString("ru-RU")); // "1 234 567,89"
  • toString() просто превращает число в строку
  • toLocaleString() дополнительно форматирует её по локали

Если нужна “сырая” строка числа, чаще подходит toString().

Если число нужно красиво показать пользователю, удобнее toLocaleString().

toLocaleString() и toFixed()

У этих методов тоже разная задача.

console.log((1234.5).toFixed(2)); // "1234.50"
console.log(
  (1234.5).toLocaleString("ru-RU", {
    minimumFractionDigits: 2,
    maximumFractionDigits: 2,
  })
); // "1 234,50"
  • toFixed() форматирует число без учёта локали
  • toLocaleString() учитывает правила языка и страны

Ошибка при currency без currency

Если использовать style: "currency", нужно обязательно указать код валюты.

(1234.56).toLocaleString("ru-RU", { style: "currency" })

Иначе будет TypeError.

Число не меняется

toLocaleString() не изменяет исходное число. Он только возвращает новую строку.

const value = 1234.56;
const formatted = value.toLocaleString("ru-RU");

console.log(value);     // 1234.56
console.log(formatted); // "1 234,56"

Когда это полезно

toLocaleString() удобно использовать, когда:

  • нужно показать число пользователю в привычном формате
  • важны разделители тысяч и дробной части
  • нужно вывести валюту, проценты или аккуратно оформленные суммы

Пример:

const price = 1999.9;

console.log(
  price.toLocaleString("ru-RU", {
    style: "currency",
    currency: "RUB",
  })
); // "1 999,90 ₽"

Когда лучше Intl.NumberFormat

Если нужно форматировать много чисел в одном и том же стиле, часто удобнее заранее создать Intl.NumberFormat.

const formatter = new Intl.NumberFormat("ru-RU", {
  style: "currency",
  currency: "RUB",
});

console.log(formatter.format(1234.56));

Для одиночных вызовов toLocaleString() обычно вполне хватает.

Частые ошибки

Думать, что метод возвращает число

const result = (1234.56).toLocaleString("ru-RU");

console.log(typeof result); // "string"

После вызова вы уже работаете со строкой.

Ждать одинаковый результат везде

console.log((1234.56).toLocaleString());

Без явной локали результат зависит от окружения.

Путать toLocaleString() и toFixed()

console.log((1234.5).toFixed(2));              // "1234.50"
console.log((1234.5).toLocaleString("ru-RU")); // "1 234,5"

Один метод нужен для фиксированной записи, другой - для локализованного отображения.

Быстрая памятка

  • toLocaleString() форматирует число по локали
  • метод возвращает строку, а не число
  • локаль влияет на разделители, валюты и проценты
  • без явной локали результат зависит от окружения
  • для style: "currency" нужно указывать currency
  • если нужно форматировать много чисел одинаково, удобно смотреть в сторону Intl.NumberFormat

Коротко

toLocaleString() - это удобный способ показать число так, как его ожидает увидеть пользователь в своей локали. Главное, что стоит запомнить: метод возвращает строку и нужен именно для отображения, а не для вычислений.