Intl.ListFormat
The Intl.ListFormat object enables language-sensitive list formatting. It allows you to join arrays of strings with localized separators (like ", ", " and ", " or ").
1. Basic Usage
The constructor takes two optional arguments: locales and options.
const vehicles = ['Motorcycle', 'Bus', 'Car'];
const formatter = new Intl.ListFormat('en-US', { style: 'long', type: 'conjunction' });
console.log(formatter.format(vehicles));
// "Motorcycle, Bus, and Car"
const germanFormatter = new Intl.ListFormat('de-DE', { style: 'long', type: 'conjunction' });
console.log(germanFormatter.format(vehicles));
// "Motorcycle, Bus und Car"
2. Types of Lists
The type option controls the logical meaning of the list.
conjunction: The "and" based list (default).disjunction: The "or" based list.unit: A list of values (usually with units).
const list = ['A', 'B', 'C'];
// Conjunction (AND)
console.log(new Intl.ListFormat('en-US', { type: 'conjunction' }).format(list));
// "A, B, and C"
// Disjunction (OR)
console.log(new Intl.ListFormat('en-US', { type: 'disjunction' }).format(list));
// "A, B, or C"
// Unit
console.log(new Intl.ListFormat('en-US', { type: 'unit' }).format(list));
// "A, B, C"
3. Styles
The style option controls the length of the formatted string.
long: "A, B, and C" (default)short: "A, B, & C"narrow: "A, B, C"
4. formatToParts
Like other Intl objects, formatToParts returns an array of objects representing the different components of the formatted string.
const formatter = new Intl.ListFormat('en-US', { type: 'conjunction' });
const parts = formatter.formatToParts(['A', 'B']);
console.log(parts);
// [{ type: "element", value: "A" }, { type: "literal", value: " and " }, { type: "element", value: "B" }]
programming/javascript/vanilla/javascript programming/javascript/vanilla/intl-numberformat programming/javascript/vanilla/intl-collator