Improved internationalization API
ECMAScript 15 introduced several enhancements to the Internationalization API, focusing on improving the capabilities for formatting dates, times, numbers, and lists, while also introducing more flexible mechanisms for localized string handling. These improvements make it easier for developers to build applications that adapt to different regions and languages.
Enhancements to Date and Time Formatting
ECMAScript 15 expanded the functionality of Intl.DateTimeFormat
with additional configuration options and formatting patterns. Developers now have more precise control over how dates and times are displayed:
// New date formatting options
const date = new Date(2023, 11, 25);
const formatter = new Intl.DateTimeFormat('en-US', {
dateStyle: 'full',
timeStyle: 'long',
calendar: 'gregory',
numberingSystem: 'latn'
});
console.log(formatter.format(date));
// Output: "Monday, December 25, 2023 at 12:00:00 AM GMT"
The new dateStyle
and timeStyle
options provide predefined formatting patterns, supporting four styles: 'full'
, 'long'
, 'medium'
, and 'short'
. Additionally, the calendar
and numberingSystem
options allow specifying different calendar and numbering systems.
Expanded Number Formatting
Intl.NumberFormat
now supports more number types and formatting options:
// New number formatting features
const number = 1234567.89;
const formatter = new Intl.NumberFormat('de-DE', {
style: 'unit',
unit: 'liter-per-100-kilometers',
unitDisplay: 'long',
signDisplay: 'exceptZero',
minimumFractionDigits: 2
});
console.log(formatter.format(number));
// Output: "+1.234.567,89 Liter pro 100 Kilometer"
New features include:
- Support for additional unit types (
unit
) - Control over unit display (
unitDisplay
) - Sign display strategies (
signDisplay
) - More flexible fractional digit control
Introduction of List Formatting
ECMAScript 15 introduced the Intl.ListFormat
API for formatting list strings:
// List formatting example
const list = ['苹果', '香蕉', '橙子'];
const formatter = new Intl.ListFormat('zh-CN', {
style: 'long',
type: 'conjunction'
});
console.log(formatter.format(list));
// Output: "苹果、香蕉和橙子"
Configurable options include:
style
: Controls format length ('long'
,'short'
, or'narrow'
)type
: Specifies conjunction type ('conjunction'
,'disjunction'
, or'unit'
)
Relative Time Formatting
The new Intl.RelativeTimeFormat
provides localized representations of relative time:
// Relative time formatting
const rtf = new Intl.RelativeTimeFormat('zh-CN', {
numeric: 'auto',
style: 'long'
});
console.log(rtf.format(-1, 'day')); // "昨天"
console.log(rtf.format(2, 'week')); // "2周后"
Supported time units include: 'second'
, 'minute'
, 'hour'
, 'day'
, 'week'
, 'month'
, and 'year'
.
Enhanced Sorting Capabilities
Intl.Collator
now supports additional sorting options:
// Enhanced string sorting
const collator = new Intl.Collator('fr-FR', {
sensitivity: 'accent',
ignorePunctuation: true,
numeric: true
});
const words = ['été', 'eté', 'été', '100', '20'];
console.log(words.sort(collator.compare));
// Output: ["20", "100", "eté", "été", "été"]
New options include:
ignorePunctuation
: Ignores punctuationnumeric
: Enables numeric-aware sorting- Finer sensitivity control
Plural Rule Handling
ECMAScript 15 provides more robust plural form handling through Intl.PluralRules
:
// Plural rule determination
const pr = new Intl.PluralRules('ar-EG');
console.log(pr.select(0)); // 'zero'
console.log(pr.select(1)); // 'one'
console.log(pr.select(2)); // 'two'
console.log(pr.select(6)); // 'few'
console.log(pr.select(18)); // 'many'
Supported plural categories include: 'zero'
, 'one'
, 'two'
, 'few'
, 'many'
, and 'other'
, depending on language rules.
Localized String Handling
The new Intl.Locale
class provides parsing and manipulation of locale identifiers:
// Locale object operations
const locale = new Intl.Locale('zh-Hans-CN', {
calendar: 'chinese',
hourCycle: 'h23'
});
console.log(locale.language); // "zh"
console.log(locale.script); // "Hans"
console.log(locale.region); // "CN"
console.log(locale.calendar); // "chinese"
Developers can access and modify various components of a locale, including language, script, region, and extension attributes.
Unit Formatting
New unit formatting capabilities handle various measurement units:
// Unit formatting
const nf = new Intl.NumberFormat('en-US', {
style: 'unit',
unit: 'mile-per-hour',
unitDisplay: 'narrow'
});
console.log(nf.format(65)); // "65 mph"
Supported unit types include length, area, volume, mass, temperature, and other physical quantities.
Date Range Formatting
Intl.DateTimeFormat
now supports date range formatting:
// Date range formatting
const start = new Date(2023, 0, 1);
const end = new Date(2023, 0, 31);
const formatter = new Intl.DateTimeFormat('en-US', {
month: 'long',
day: 'numeric'
});
console.log(formatter.formatRange(start, end));
// Output: "January 1 – 31"
Time Zone Name Display
Localized display names for time zones can now be retrieved:
// Time zone name display
const formatter = new Intl.DateTimeFormat('en-US', {
timeZoneName: 'longGeneric'
});
console.log(formatter.format(new Date()));
// Possible output: "10/15/2023, Pacific Time"
Supported time name types include: 'short'
, 'long'
, 'shortOffset'
, 'longOffset'
, 'shortGeneric'
, and 'longGeneric'
.
本站部分内容来自互联网,一切版权均归源网站或源作者所有。
如果侵犯了你的权益请来信告知我们删除。邮箱:cc@cccx.cn