JavaScript® (often shortened to JS) is a lightweight, interpreted, object-oriented language with first-class functions, most known as the scripting language for Web pages, but used in many non-browser environments as well such as node.js or Apache CouchDB. It is a prototype-based, multi-paradigm scripting language that is dynamic, and supports object-oriented, imperative, and functional programming styles.

javascript

Personalizing the user experience is becoming more critical every day, even more so if your application or content is consumed by users in different parts of the world who most likely use other languages, date formats, currency, etc.

There are multiple solutions to make your content adapt to the location or language of your users. Still, many of these methods have become outdated, complex, or dependent on a particular framework.

Javascript also offers an internationalization solution, the Intl object.

When working in an application that will be used or consumed by users all over the world, is important to display the data in a way that makes sense for them.

Som data can be simple to change based on their language, like translating text, but what happens with other pieces of information? 

Dates can be a complex subject. Manually formatting dates based on the language can be bug-prone. Lucky for us, Javascript exposes an API that handles this: *Intl.DateTimeFormat*

Displaying Language Sensitive Dates With Javascript Intl API

Numbers are another piece of information that have different ways to be formatted based on the different languages that users may use. One example of this is to display a value in different currencies.

Currencies have not only different symbols but also different ways to punctuate or accommodate the numbers on them.

Javascript offers a way to handle this simply by just defining the language (locale) and the currency symbol you want to use. This API is *Intl.NumberFormat*

Format Numbers as Currencies Using Javascript Intl API

Numbers have many ways to be displayed on the screen, one of that is to show them in short or compact ways. Instead of an enormous number like `123456`, show `123K`. This and other summarized forms can be easily done by using *Intl.NumberFormat*

Displaying Compact Format Numbers Using Intl Javascript API

Sometimes, you want to display the dates in a relative form, such as: 2 weeks ago. You can do this by doing some math and string concatenation with the dates, but Intl helps you with this.

When would you use something like this?

Imagine a list of articles, each article has a publication date, but you don't want to show just that. You want to show how much relative time is between the publication date and today (the day the user is reading the list).

Getting Relative Time Dates That Are Locale Sensitive With Javascript Intl API

Displaying a list is one of the most used ways to showcase information in a web app. But since your users speak different languages you need a way to format the list based on that language convention.

To avoid the hassle of implementing these formatting rules by hand - that could be really hard - Intl offers the ListFormat API.

What this formatter does is basically join an array of strings with the correct conjunction or disjunction to create a meaningful phrase.

Javascript Internationalization Object

Matías Hernández

Free Community Resource

Free Community Resource

Course Content