JavaScript Intl API
Embed This Widget
Add the script tag and a data attribute to embed this widget.
Embed via iframe for maximum compatibility.
<iframe src="https://unicodefyi.com/iframe/glossary/intl-api/" width="420" height="400" frameborder="0" style="border:0;border-radius:10px;max-width:100%" loading="lazy"></iframe>
Paste this URL in WordPress, Medium, or any oEmbed-compatible platform.
https://unicodefyi.com/glossary/intl-api/
Add a dynamic SVG badge to your README or docs.
[](https://unicodefyi.com/glossary/intl-api/)
Use the native HTML custom element.
ECMAScript Internationalization API providing locale-aware string comparison (Collator), number formatting (NumberFormat), date formatting (DateTimeFormat), and segmentation (Segmenter).
What is the JavaScript Intl API?
The JavaScript Internationalization API (Intl) is a built-in namespace introduced in ECMAScript 2015 (ES6) that provides locale-sensitive operations without requiring external libraries. It wraps the ICU (International Components for Unicode) library available in V8, SpiderMonkey, and other engines, exposing collation, number formatting, date/time formatting, text segmentation, and more.
Intl.Collator — Locale-Aware Sorting
Intl.Collator compares strings according to locale-specific rules, making it essential for any sorted list that will be displayed to users in their language.
const collator = new Intl.Collator("de", { sensitivity: "base" });
["München", "Berlin", "Ärger"].sort(collator.compare);
// → ["Ärger", "Berlin", "München"] (German alphabetical order)
The sensitivity option controls whether accents and case differences matter: "base" ignores both, "accent" ignores only case, "case" ignores only accents, and "variant" (default) considers both.
Intl.NumberFormat — Numbers, Currencies, Units
Intl.NumberFormat formats numbers according to locale conventions, handling decimal separators (period vs comma), digit grouping, currency symbols, and measurement units.
new Intl.NumberFormat("de-DE", { style: "currency", currency: "EUR" })
.format(1234567.89);
// → "1.234.567,89 €"
new Intl.NumberFormat("en-US", { style: "unit", unit: "kilometer-per-hour" })
.format(100);
// → "100 km/h"
Intl.DateTimeFormat — Dates and Times
new Intl.DateTimeFormat("ja-JP", { dateStyle: "full", timeStyle: "short" })
.format(new Date("2024-06-15"));
// → "2024年6月15日土曜日 0:00"
The calendar option supports non-Gregorian calendars: "islamic", "hebrew", "chinese", "buddhist", and others. The timeZone option accepts IANA time zone identifiers.
Intl.Segmenter — Grapheme, Word, Sentence Boundaries
Intl.Segmenter is one of the most powerful features in the Intl API. It splits text into grapheme clusters, words, or sentences using locale-aware rules from UAX#29.
const seg = new Intl.Segmenter("en", { granularity: "grapheme" });
[...seg.segment("e\u0301")].length; // 1 grapheme cluster (é)
const wordSeg = new Intl.Segmenter("ja", { granularity: "word" });
const words = [...wordSeg.segment("日本語のテキスト")];
// Correctly splits Japanese text without spaces
Intl.DisplayNames — Human-Readable Names for Codes
Intl.DisplayNames translates ISO language codes, region codes, script codes, and currency codes into human-readable names in any locale.
const dn = new Intl.DisplayNames("ko", { type: "language" });
dn.of("en"); // → "영어"
dn.of("ja"); // → "일본어"
const regions = new Intl.DisplayNames("fr", { type: "region" });
regions.of("JP"); // → "Japon"
Quick Facts
| Class | Purpose |
|---|---|
Intl.Collator |
Locale-sensitive string comparison and sorting |
Intl.NumberFormat |
Numbers, currencies, percentages, units |
Intl.DateTimeFormat |
Dates, times, calendars, time zones |
Intl.Segmenter |
Grapheme / word / sentence segmentation |
Intl.DisplayNames |
Human-readable names for language/region codes |
Intl.PluralRules |
Plural category selection (one/few/many/other) |
Intl.RelativeTimeFormat |
"3 days ago", "in 2 weeks" |
| Underlying library | ICU (International Components for Unicode) |
| Specification | ECMA-402 (Internationalization API Specification) |
相关术语
网页与 HTML 中的更多内容
声明响应字符编码的HTTP头参数(Content-Type: text/html; charset=utf-8),优先级高于文档内的编码声明。
通过::before和::after伪元素使用Unicode转义插入生成内容的CSS属性:content: '\2713'可插入✓。
CSS properties (direction, writing-mode, unicode-bidi) controlling text layout direction. Works with Unicode …
HTML中字符的文本表示方式,有三种形式:命名(&)、十进制(&)、十六进制(&),对于与HTML语法冲突的字符是必需的。
将Unicode域名转换为xn--前缀ASCII字符串的ASCII兼容编码,例如münchen.de → xn--mnchen-3ya.de。
CSS supports Unicode via escape sequences (\2713 for ✓), the content property …
XML版本的数字字符引用:✓或✓,XML只有5个命名实体(& < > " '),而HTML5有2,231个。
选择特定字形变体的字符(U+FE00–U+FE0F、U+E0100–U+E01EF),VS15(U+FE0E)表示文本呈现,VS16(U+FE0F)表示表情符号呈现。
使用人类可读名称的HTML实体:© → ©,— → —。HTML5定义了2,231个命名引用,且区分大小写。
包含非ASCII Unicode字符的域名,内部以Punycode(xn--...)存储,但向用户显示为Unicode,安全隐患:同形字攻击。