Азиатский формат

В библиотеке AutoNumeric основа форматирования чисел строится вокруг управляемых правил разбиения целой части, знаков дроби, символов валют и нормализации пользовательского ввода. При переходе к азиатским региональным форматам основное отличие проявляется в логике группировки разрядов, где стандартная западная модель 1,234,567.89 перестаёт быть универсальной.

Группировка разрядов и региональные особенности

В классическом варианте AutoNumeric использует параметр:

  • digitGroupSeparator — символ разделителя групп разрядов
  • decimalCharacter — символ десятичного разделителя
  • decimalPlaces — количество знаков после запятой

Типичная западная конфигурация:

{
  digitGroupSeparator: ",",
  decimalCharacter: ".",
  decimalPlaces: 2
}

Однако азиатские форматы требуют иной логики представления чисел.

Индийская система счисления (lakh / crore)

Индийский формат отличается нерегулярной группировкой:

  • первая группа из 3 цифр
  • далее группы по 2 цифры

Пример:

  • 1,23,45,678 вместо 12,345,678

Особенность AutoNumeric

AutoNumeric не предоставляет встроенного режима lakh/crore, поэтому используется один из двух подходов:

1. Предварительное форматирование значения

Форматирование выполняется перед передачей значения в AutoNumeric.

Пример функции:

function formatIndianNumber(value) {
  const str = value.toString().replace(/\D/g, "");
  const lastThree = str.slice(-3);
  const otherNumbers = str.slice(0, -3);

  if (otherNumbers !== "") {
    return (
      otherNumbers.replace(/\B(?=(\d{2})+(?!\d))/g, ",") +
      "," +
      lastThree
    );
  }

  return lastThree;
}

Далее AutoNumeric работает уже с готовым отображаемым значением, при этом важно отключить повторное форматирование:

new AutoNumeric(element, {
  digitGroupSeparator: ",",
  decimalCharacter: ".",
  modifyValueOnWheel: false
});

2. Работа через «сырое значение»

AutoNumeric хранит числовое значение отдельно от отображаемого. Это позволяет:

  • хранить данные в стандартном формате 12345678
  • отображать значение в кастомной форме

В этом сценарии форматирование выполняется вне библиотеки, а AutoNumeric используется как слой контроля ввода.

Восточноазиатский формат (Китай, Япония, Корея)

В ряде восточноазиатских систем традиционно применяется группировка по 4 цифры (мириады):

  • 1 2345 6789
  • или 1234 5678

В веб-интерфейсах чаще используется один из упрощённых вариантов:

  • отсутствие разделителей
  • либо пробел как универсальный разделитель

Конфигурация без группировки

Самый распространённый подход:

{
  digitGroupSeparator: "",
  decimalCharacter: ".",
  decimalPlaces: 0
}

В этом режиме число отображается непрерывной строкой:

  • 123456789

Группировка через пробел

В интерфейсах, ориентированных на читаемость, используется пробел:

{
  digitGroupSeparator: " ",
  decimalCharacter: ".",
  decimalPlaces: 2
}

Результат:

  • 123 456 789

Такой вариант чаще встречается в адаптированных международных интерфейсах, а не в чисто локальных стандартах.

Гибридные сценарии форматирования

При работе с многоязычными интерфейсами азиатские форматы часто комбинируются с переключением локали.

Типовая архитектура:

  • хранение значения в стандартном виде (без разделителей)
  • динамическое переключение отображения
  • переинициализация AutoNumeric при смене региона

Пример переключения конфигурации:

const configs = {
  us: {
    digitGroupSeparator: ",",
    decimalCharacter: ".",
    decimalPlaces: 2
  },
  asiaPlain: {
    digitGroupSeparator: "",
    decimalCharacter: ".",
    decimalPlaces: 2
  },
  asiaSpace: {
    digitGroupSeparator: " ",
    decimalCharacter: ".",
    decimalPlaces: 2
  }
};

Переключение экземпляра:

AutoNumeric.set(element, configs.asiaSpace);

Особенности обработки ввода

При азиатских форматах критично поведение следующих аспектов:

1. Ввод без разделителей

Пользовательский ввод чаще всего осуществляется непрерывной строкой. AutoNumeric автоматически нормализует значение при потере фокуса.

2. Десятичные символы

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

3. Ограничение диапазона

При работе с финансовыми данными используются:

{
  minimumValue: "0",
  maximumValue: "9999999999"
}

Проблематика индийского формата в UI-валидации

Основная сложность заключается в несоответствии визуального и числового представления.

Пример:

  • отображение: 1,23,45,678
  • реальное значение: 12345678

Поэтому критично разделение:

  • display value (форматированный)
  • raw value (числовой)

AutoNumeric обеспечивает это разделение через внутренний механизм хранения значения.

Интеграция с серверной моделью данных

При передаче данных на сервер азиатские форматы не должны сохраняться в строковом виде.

Рекомендуемая схема работы:

  • на клиенте: AutoNumeric для ввода и отображения
  • при отправке: getNumericString() или аналогичный метод извлечения «сырого» значения
  • на сервере: обработка чистого числа без форматирования

Комбинация с валютами в азиатских интерфейсах

В финансовых интерфейсах часто требуется совместное использование:

  • локального формата чисел
  • валютного символа

Пример конфигурации:

{
  currencySymbol: "¥",
  currencySymbolPlacement: "p",
  digitGroupSeparator: " ",
  decimalCharacter: ".",
  decimalPlaces: 0
}

Особенность азиатских валютных интерфейсов заключается в частом отсутствии десятичных знаков, особенно для иеновых значений.

Производительность при массовом форматировании

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

Оптимизация достигается через:

  • минимизацию повторной инициализации AutoNumeric
  • использование делегирования событий
  • хранение raw-значений отдельно от DOM

Поведение при вставке данных (paste)

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

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

Итоговые паттерны использования

На практике азиатские форматы в AutoNumeric сводятся к трём устойчивым конфигурациям:

  • отсутствие группировки для строгих цифровых интерфейсов
  • пробельная группировка для читаемости
  • внешняя реализация индийского lakh/crore формата с последующей интеграцией в AutoNumeric как слой отображения

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

Оглавление