Как вы решаете задачу формирования красивой цены с отступами между разрядами?
Естественно, если вы используете CMS, то там все решается за вас, но давайте рассмотрим собственную реализацию со своим фронтом, который использует API бэкенда вашего магазина.
Есть вариант - никак. То есть показывать число "как есть" - это боль для покупателя, особенно, если стоимости товаров начинаются с 1К. Давайте взглянем на разницу.
26985 или 26 985. Мне кажется выбор очевиден. Тогда давайте переходит к следующим вариантам.
Делать это на сервере. То есть вам приходит с сервера уже готовая стоимость строкой, отформатированная в соответствии с установленными в админке параметрами. Это удобно и кажется идеальным решением - свалить все проблемы на сторону бэкенда, но не все так просто, поэтому, стоимость приходит еще и числом и в этом есть большая необходимость. На своем опыте могу сказать, что все равно потребуются какие-то операции на фронте. К примеру, надо применить какую-то скидку или сложить стоимости товаров в корзине, или сделать превью применения промо-кода. Еще из минусов, если нам предстоит делать какие-то операции на фронте, то появится распределение логики между фронтом и бэком, ведь полученный результат операций с ценами нам придется преобразовывать в тот же формат, что пришел с сервера.
Делать это на фронте. И тут начинается "зоопарк", и это причина, почему вообще этот пост опубликован. Каких только реализаций не видовал свет, от регулярок до хитрых многостроковых преобразований. Проблема, как мне кажется в названии, метода toLocaleString или класса локализации - Intl. Не очень говорящие названия, согласитесь… а теперь давайте посмотрим как их использовать.
const number = 26985;
const price = number.toLocaleString('ru-RU');
//результат 26 985
или при использовании класса Intl
const price = new Intl.NumberFormat('ru-RU').format(26985);
//результат 26 985
Очень просто, согласитесь!
Это все что я хотел сказать сегодня. Всем хорошего дня и чистого кода!