Building world-ready applications in JavaScript using IE11
With Internet Explorer 11, Web applications can now use JavaScript ECMAScript Internationalization APIs, which provide a standard JavaScript based interface to deliver great world-ready experiences such as number, date, time and currency formatting and culture specific string collation (comparisons). In IE11, Web apps can utilize capabilities exposed by the Windows internationalization library, which includes support for over 364 locales, 18 numbering systems, various date patterns, and well known calendaring systems–Gregorian, Islamic, Hebrew, Buddhist, Korean, and Japanese calendars. The ECMA-402 specification also updates existing toLocale* APIs of ECMAScript 5.1 to make them truly locale sensitive.
Web applications have traditionally been hard to globalize because JavaScript lacked support for basic helpers and objects exposing the underlying operating system capabilities. Applications relied on plug-ins, browser extensions, or server-side data manipulations to offer world ready globalization experiences. IE11’s support for ECMA-402 makes world-ready JavaScript applications straightforward.
[h=1]Culture aware string collation (sorting)[/h] IE11 automates the often-complex logic behind locale-specific string sorting. Conventions for sorting and ordering of strings varies widely across languages and cultures. Sort orders may be based on case-sensitivity, phonetics or the visual representation of characters. For example, in East Asian languages, characters are sorted by the stroke and radical of ideographs. Sorting also depends on the alphabetical ordering followed by different languages and its cultures. For example, the Swedish language has an "Æ" character that sorts after "Z". The German language also has an "Æ" character, but sorts it like "ae", after "A".
In IE11, a culture-sensitive collator object can be constructed using the Intl.Collator constructor with desired locale tag and options. The compare method of the collator object can be used to compare two strings. String.prototype.localeCompare has also been updated to internally use Intl.Collator for locale sensitive comparison and now supports two more optional arguments, locale and options.
The following example illustrates how the Intl.Collator.prototype.compare evaluates strings ("Apple", "Æble" and “Zebra”) differently during sorting, depending on the culture used for the comparison.
var arr = ["Apple", "Æble", "Zebra"];
// Create collator object to use culture rules for English in the U.S.
var co = new Intl.Collator("en-US");
// Sorting array ‘arr’ produces [Æble, Apple, Zebra] based on en-US rules
arr.sort(function(a, b) {*
*** return co.compare(a, b);
});*
// Create collator object to use culture rules for Danish in Denmark
var co = new Intl.Collator("da-DK");
// Sorting array ‘arr’ produces [Apple, Zebra, Æble] based on da-DK rules
arr.sort(function(a, b) {
*** return co.compare(a, b);
});*
[h=1]Number formatting[/h] IE11 supports the variety of conventions used by different locales and numbering systems to format and display numbers. When representing and comparing numbers, IE11 supports different styles such as “decimal,” “percent,” and “currency.” For currency, display options include “code” and “symbol.” Different locales may establish minimum or maximum integer, fraction or significant digits to be displayed. For example, the decimal number 10000.50 is formatted as 10,000.50 for the culture "en-US" and 10.000,50 for the culture "de-DE".
A culture-sensitive NumberFormat object can be constructed using the Intl.NumberFormat constructor with desired locale tag and options. The format method of the NumberFormat object may be used to format numeric data based on the locale and options set. Number.prototype.toLocaleString has also been updated to internally use Intl.NumberFormat for culture sensitive formatting and now supports two optional arguments - locale and options.
You can try the World Data Test Drive, which uses the new number formatting APIs available in JavaScript to format numbers as decimals, percentage, or currencies including native currency visualization.
[h=1]Date and time formatting[/h] Similar to variations in number formats, date and time formats also vary across locales, and IE11 supports multiple options such as timezone, era, year, month, weekday, day, hour, minute, second and so on.
IE11’s new internationalization APIs support locale-specific number formatting with no extra code
A culture-sensitive DateTimeFormat object can be constructed using the Intl.DateTimeFormat constructor with desired locale tag and options. The format method of the DateTimeFormat object may be used to format time values based on the locale and options set. Existing locale sensitive APIs Date.prototype.toLocaleString, Date.prototype.toLocaleDateString and Date.prototype.toLocaleTimeString have also been updated to internally use Intl.DateTimeFormat for culture sensitive formatting and now support two additional arguments—locale and options.
In the World Data Test Drive, when you click and select a country, you can format the latest population census dates across various locales and cultures, and you can choose options like short month and year
[h=1]Summary[/h] IE11 culminates our first step towards evolving the JavaScript language and helping Web developer’s author world-ready applications, the standards committee continues to refine the list of proposals for the next version of the standards. As with version 1.0 of ECMAScript-402, we welcome feedback on the current set of proposals for version 2.0 to ensure we faithfully represent the needs of Web developers when the committee meets every few months.
IE11’s new internationalization APIs support locale-specific date and time formatting with no extra code
We look forward to exciting new world-ready Web applications that will be created using the new standards-based APIs in IE11.
— Suresh Jayabalan, Program Manager, JavaScript Team
More...
