Форматирование чисел в JavaScript с использованием запятых в качестве разделителей тысяч

Форматирование чисел в JavaScript может стать источником сложностей для начинающих разработчиков. Одно из таких задач – это отображение чисел с использованием запятых в качестве разделителей тысяч. Например, число 1234567 должно отображаться как «1,234,567».

Сейчас рассмотрим несколько подходов.

Использование метода toLocaleString()

Нативный метод toLocaleString() в JavaScript автоматически форматирует числа с использованием запятых в качестве разделителей тысяч.

let number = 1234567;
console.log(number.toLocaleString()); // "1,234,567"

Метод toLocaleString() работает и с числами с плавающей точкой:

let floatNumber = 1234567.89;
console.log(floatNumber.toLocaleString()); // "1,234,567.89"

Использование регулярных выражений

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

function numberWithCommas(x) {
    return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}

console.log(numberWithCommas(1234567)); // "1,234,567"

В этой функции регулярное выражение \B(?=(\d{3})+(?!\d)) соответствует границе слова (\B), после которой следует группа из трех цифр ((\d{3})), и это должно повторяться один или более раз (+), и после этой группы не должно быть другой цифры ((?!\d)). Все найденные совпадения заменяются запятой (",").

Этот подход также работает с числами с плавающей точкой:

console.log(numberWithCommas(1234567.89)); // "1,234,567.89"

Вывод

Таким образом, в JavaScript есть различные подходы для форматирования чисел с использованием запятых в качестве разделителей тысяч. Выбор подхода зависит от требований задачи и личных предпочтений разработчика.