Intl API Browser
Intl (Internationalization API) adalah API bawaan browser untuk formatting angka, tanggal, dan teks sesuai locale — tanpa library tambahan.
Intl.DateTimeFormat
const date = new Date("2026-04-16");
// Format sesuai locale
new Intl.DateTimeFormat("id-ID").format(date)
// "16/4/2026"
new Intl.DateTimeFormat("en-US").format(date)
// "4/16/2026"
new Intl.DateTimeFormat("ja-JP", {
year: "numeric", month: "long", day: "numeric"
}).format(date)
// "2026年4月16日"
// Opsi lengkap
new Intl.DateTimeFormat("id-ID", {
weekday: "long",
year: "numeric",
month: "long",
day: "numeric",
hour: "2-digit",
minute: "2-digit",
timeZone: "Asia/Jakarta"
}).format(date)
// "Kamis, 16 April 2026 07.00"
Intl.NumberFormat
// Angka biasa
new Intl.NumberFormat("id-ID").format(1234567.89)
// "1.234.567,89"
new Intl.NumberFormat("en-US").format(1234567.89)
// "1,234,567.89"
// Mata uang
new Intl.NumberFormat("id-ID", {
style: "currency", currency: "IDR"
}).format(150000)
// "Rp 150.000,00"
new Intl.NumberFormat("ja-JP", {
style: "currency", currency: "JPY"
}).format(1500)
// "¥1,500"
// Persen
new Intl.NumberFormat("id-ID", {
style: "percent", minimumFractionDigits: 1
}).format(0.856)
// "85,6%"
// Compact notation
new Intl.NumberFormat("en", { notation: "compact" }).format(1500000)
// "1.5M"
Intl.RelativeTimeFormat
const rtf = new Intl.RelativeTimeFormat("id", { numeric: "auto" });
rtf.format(-1, "day") // "kemarin"
rtf.format(-2, "day") // "2 hari yang lalu"
rtf.format(1, "hour") // "dalam 1 jam"
rtf.format(0, "day") // "hari ini"
// English
const rtfEn = new Intl.RelativeTimeFormat("en", { numeric: "auto" });
rtfEn.format(-1, "day") // "yesterday"
rtfEn.format(3, "month") // "in 3 months"
Intl.Collator — Sorting Locale-aware
// Default sort tidak mengerti aksara non-ASCII
const names = ["Über", "Apfel", "Öl", "Birne"];
// ❌ Default
names.sort() // ["Apfel", "Birne", "Öl", "Über"] — Ö dan Ü di akhir
// ✅ Locale-aware
names.sort(new Intl.Collator("de").compare)
// ["Apfel", "Birne", "Öl", "Über"] — urutan benar dalam Jerman
Intl.ListFormat
const items = ["React", "Vue", "Svelte"];
new Intl.ListFormat("id", { type: "conjunction" }).format(items)
// "React, Vue, dan Svelte"
new Intl.ListFormat("en", { type: "disjunction" }).format(items)
// "React, Vue, or Svelte"