146

I'm wondering how to deal internationalization in JavaScript. I googled but I'm not getting convincing answers for:

  • Does JavaScript have native support for internationalization?
  • What is i18n in JavaScript?
  • How to deal with calendars, currencies, dates, etc.?

I've already read Internationalization inside JavaScript.

Community
  • 1
  • 1
rajakvk
  • 9,775
  • 17
  • 46
  • 49
  • 1
    Microsoft has recently released a jquery globalization plugin. The details are [here](http://weblogs.asp.net/scottgu/archive/2010/06/10/jquery-globalization-plugin-from-microsoft.aspx) – Adeel Jun 21 '10 at 12:51

4 Answers4

164

Localization support in legacy browsers is poor. Originally, this was due to phrases in the ECMAScript language spec that look like this:

Number.prototype.toLocaleString()
Produces a string value that represents the value of the Number formatted according to the conventions of the host environment’s current locale. This function is implementation-dependent, and it is permissible, but not encouraged, for it to return the same thing as toString.

Every localization method defined in the spec is defined as "implementation-dependent", which results in a lot of inconsistencies. In this instance, Chrome Opera and Safari would return the same thing as .toString(). Firefox and IE will return locale formatted strings, and IE even includes a thousand separator (perfect for currency strings). Chrome was recently updated to return a thousands-separated string, though with no fixed decimal.

For modern environments, the ECMAScript Internationalization API spec, a new standard that complements the ECMAScript Language spec, provides much better support for string comparison, number formatting, and the date and time formatting; it also fixes the corresponding functions in the Language Spec. An introduction can be found here. Implementations are available in:

  • Chrome 24
  • Firefox 29
  • Internet Explorer 11
  • Opera 15

There is also a compatibility implementation, Intl.js, which will provide the API in environments where it doesn't already exist.

Determining the user's preferred language remains a problem since there's no specification for obtaining the current language. Each browser implements a method to obtain a language string, but this could be based on the user's operating system language or just the language of the browser:

// navigator.userLanguage for IE, navigator.language for others
var lang = navigator.language || navigator.userLanguage;

A good workaround for this is to dump the Accept-Language header from the server to the client. If formatted as a JavaScript, it can be passed to the Internationalization API constructors, which will automatically pick the best (or first-supported) locale.

In short, you have to put in a lot of the work yourself, or use a framework/library, because you cannot rely on the browser to do it for you.

Various libraries and plugins for localization:

  • Others:

Feel free to add/edit.

Mihir Ajmera
  • 127
  • 1
  • 9
Andy E
  • 338,112
  • 86
  • 474
  • 445
  • 15
    Thanks to all the people contributing; I'd never have thought I could learn something by reading my old answers. I'm glad to see the update for Internationalization API spec in there, that's really awesome and I just got to test drive it in Chrome. – Andy E Feb 08 '13 at 17:47
  • 2
    Thanks for the excellent compilation. On a positive note, it looks like Mozilla might ship a modern toLocaleString() soon – possibly FF28: https://bugzilla.mozilla.org/show_bug.cgi?id=769871 – Chris Adams Feb 04 '14 at 16:05
  • 3
    http://i18next.com now comes with a translation management built on top http://locize.com - this might be a big win if you need to solve the complete translation process - not just instrument your code for i18n. Plus has a nice Incontext Editor feature... – jamuhl Apr 26 '17 at 22:45
  • Localisation as implemented by ECMA-402 conflates language and formatting to the extent that it's almost useless. The two are completely separate concerns. I guess if you just want a quick and easy solution it "works", but the notion that numbers or dates should be formatted for a particular language without any prior idea of the result is not conducive to good programming. – RobG Jan 18 '22 at 09:17
13

Mozilla recently released the awesome L20n or localization 2.0. In their own words L20n is

an open source, localization-specific scripting language used to process gender, plurals, conjugations, and most of the other quirky elements of natural language.

Their js implementation is on the github L20n repository.

ashwoods
  • 2,209
  • 1
  • 22
  • 36
  • I have started a project which needs localization and we have decided to use L20n too ;). So I have wrotten a first version of a L20n Plugin for RequireJS (https://github.com/fernandogmar/L20n-RequireJS) in case you use RequireJS I hope it would be useful for you too. Any suggestion will be welcomed. – Fernando Gm Jul 13 '13 at 18:43
  • This is deprecated for https://www.projectfluent.org/ now – icc97 Nov 17 '20 at 14:03
0

You can also try another library - https://github.com/wikimedia/jquery.i18n .

In addition to parameter replacement and multiple plural forms, it has support for gender a rather unique feature of custom grammar rules that some languages need.

Amir E. Aharoni
  • 1,308
  • 2
  • 13
  • 25
0

Some of it is native, the rest is available through libraries.

For example Datejs is a good international date library.

For the rest, it's just about language translation, and JavaScript is natively Unicode compatible (as well as all major browsers).

Luca Matteis
  • 29,161
  • 19
  • 114
  • 169