Intl.NumberFormat v3 API

ECMAScript 13's Intl.NumberFormat v3 API is a major upgrade to internationalized number formatting, introducing finer-grained control and practical features that cover scenarios ranging from basic number formatting to advanced scientific, engineering, and unit display requirements.

Overview of New Features

Intl.NumberFormat v3 in ES13 adds key configuration options such as roundingMode, roundingPriority, and roundingIncrement, while extending native support for measurement units and scientific notation. Core improvements include:

• Precise rounding control (banker's rounding/downward rounding)
• Custom rounding increments (e.g., steps of 5)
• Engineering notation support
• Expanded unit systems (bits/bytes/percentages, etc.)

Fine-Grained Rounding Control

The roundingMode parameter specifies 8 rounding strategies:

const nf = new Intl.NumberFormat("en-US", {
  style: "currency",
  currency: "USD",
  roundingMode: "halfEven" // Banker's rounding
});
console.log(nf.format(3.5)); // "$4.00"
console.log(nf.format(4.5)); // "$4.00"

// Other mode examples
new Intl.NumberFormat("de-DE", {
  roundingMode: "floor",
  maximumFractionDigits: 0
}).format(4.8); // "4"

Rounding Increment Configuration

roundingIncrement allows defining rounding steps, used with roundingPriority:

// Round prices in increments of 0.25
const nf = new Intl.NumberFormat("en-US", {
  style: "decimal",
  roundingIncrement: 25,
  minimumFractionDigits: 2
});
nf.format(1.12); // "1.25"
nf.format(1.62); // "1.75"

// Prioritize increment rounding
new Intl.NumberFormat("ja-JP", {
  roundingIncrement: 10,
  roundingPriority: "auto"
}).format(123); // "120"

Engineering and Scientific Notation

New notation option supports engineering/scientific display:

// Engineering notation (thousands-based)
new Intl.NumberFormat("fr-FR", {
  notation: "engineering",
  maximumFractionDigits: 2
}).format(12345); // "12,35E3"

// Scientific notation
new Intl.NumberFormat("zh-CN", {
  notation: "scientific",
  minimumSignificantDigits: 3
}).format(0.000123); // "1.23E-4"

Expanded Unit Systems

Supports 192 standard measurement units, including data storage:

// Automatic data unit conversion
new Intl.NumberFormat("en-US", {
  style: "unit",
  unit: "gigabyte",
  unitDisplay: "short"
}).format(1500); // "1.5 TB"

// Compound unit display
new Intl.NumberFormat("de-DE", {
  style: "unit",
  unit: "meter-per-second",
  unitDisplay: "narrow"
}).format(10); // "10m/s"

Compact Display Optimization

compactDisplay parameter enhances short-format control:

// Long-form compact display
new Intl.NumberFormat("es-ES", {
  notation: "compact",
  compactDisplay: "long"
}).format(1e6); // "1 millón"

// Short-form (default)
new Intl.NumberFormat("ko-KR", {
  notation: "compact"
}).format(1500); // "1.5천"

Sign Display Strategies

New signDisplay extension options:

// Force +/- signs
new Intl.NumberFormat("it-IT", {
  signDisplay: "always"
}).format(100); // "+100"

// Accounting negative format
new Intl.NumberFormat("en-US", {
  style: "accounting",
  currency: "USD"
}).format(-500); // "($500.00)"

Localized Numbering Systems

Supports 21 numbering system conversions:

// Arabic-Indic numerals
new Intl.NumberFormat("ar-SA", {
  numberingSystem: "arab"
}).format(1234); // "١٬٢٣٤"

// Chinese financial uppercase (experimental)
new Intl.NumberFormat("zh-CN-u-nu-finance", {
  style: "currency",
  currency: "CNY"
}).format(1234.56); // "人民币壹仟贰佰叁拾肆元伍角陆分"

Performance Optimization Tips

Reuse instances for high-frequency formatting:

// Singleton pattern optimization
const cachedFormatters = new Map();

function formatNumber(locale, options, value) {
  const key = JSON.stringify([locale, options]);
  if (!cachedFormatters.has(key)) {
    cachedFormatters.set(key, new Intl.NumberFormat(locale, options));
  }
  return cachedFormatters.get(key).format(value);
}

Browser Compatibility Strategy

Recommend feature detection for progressive enhancement:

function supportsRoundingIncrement() {
  try {
    new Intl.NumberFormat(undefined, { roundingIncrement: 5 });
    return true;
  } catch {
    return false;
  }
}