Home Writing Reading

til / Using intl with hindi and arabic numbers

This week, I’ve been investigating and experimenting with adding support for multiple languages to an app I’m working on.

I tested various character sets, as well as right-to-left (RTL) languages, using four languages: Arabic, English, Hindi, and Swedish. For these, I used the locales ar, en-US, hi-IN, and sv-SE.

I expected Arabic to use Eastern Arabic numerals and Hindi to use Devanagari numerals, but they were both using Arabic numerals.

new Intl.NumberFormat("hi-IN").format(1234);
new Intl.NumberFormat("ar").format(1234);
// Both display 1,234

The use of Western or Eastern-style Arabic numerals varies by region. To display Eastern Arabic numerals, the solution is simple: add a country identifier to the locale, e.g., ar-SA (Arabic as spoken in Saudi Arabia).

new Intl.NumberFormat("ar-SA").format(1234);

This would display the number as:

١٬٢٣٤

For Hindi, the solution was a bit more complicated and requires some more knowledge of how IETF language tags work.

Using a language tag, like hi-IN, we can also include extensions to it using -u-<key>-<type>, where u is the extension identifier. To find the extension key we need, we can look at the list of key/type definitions. The key we want is nu for the numbering system.

On the title line for numbering systems, we can find a link to all valid number types, including Devanagari, denoted as deva.

We assemble all the pieces to hi-IN-u-nu-deva and use it with Intl to format numbers in Devanagari.

new Intl.NumberFormat("hi-In-u-nu-deva").format(1234);
// १,२३४

We can use this method to change the numbering system, or some other extension key, for any locale. This means we can use the same method with our initial locale for Arabic, ar, and expect the same formatting.

new Intl.NumberFormat("ar-u-nu-arab").format(1234);

  • IETF. (2023-03-17). BCP 47 Unicode Locale Extension (RFC 6067). Link

  • Loading next post...
  • Loading previous post...