Web/JavaScript/Reference/Global objects/Intl/DateTimeFormat/formatRange

From Get docs


The Intl.DateTimeFormat.prototype.formatRange() formats a date range in the most concise way based on the locale and options provided when instantiating Intl.DateTimeFormat object.


The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

Syntax

Intl.DateTimeFormat.prototype.formatRange(startDate, endDate)

Examples

Basic formatRange usage

This method receives two Dates and formats the date range in the most concise way based on the locale and options provided when instantiating Intl.DateTimeFormat.

let date1 = new Date(Date.UTC(2007, 0, 10, 10, 0, 0));
let date2 = new Date(Date.UTC(2007, 0, 10, 11, 0, 0));
let date3 = new Date(Date.UTC(2007, 0, 20, 10, 0, 0));
// > 'Wed, 10 Jan 2007 10:00:00 GMT'
// > 'Wed, 10 Jan 2007 11:00:00 GMT'
// > 'Sat, 20 Jan 2007 10:00:00 GMT'

let fmt1 = new Intl.DateTimeFormat("en", {
    year: '2-digit',
    month: 'numeric',
    day: 'numeric',
    hour: 'numeric',
    minute: 'numeric'
});
console.log(fmt1.format(date1));
console.log(fmt1.formatRange(date1, date2));
console.log(fmt1.formatRange(date1, date3));
// > '1/10/07, 10:00 AM'
// > '1/10/07, 10:00 – 11:00 AM'
// > '1/10/07, 10:00 AM – 1/20/07, 10:00 AM'

let fmt2 = new Intl.DateTimeFormat("en", {
    year: 'numeric',
    month: 'short',
    day: 'numeric'
});
console.log(fmt2.format(date1));
console.log(fmt2.formatRange(date1, date2));
console.log(fmt2.formatRange(date1, date3));
// > 'Jan 10, 2007'
// > 'Jan 10, 2007'
// > 'Jan 10 – 20, 2007'

Specifications

Specification
Intl.DateTimeFormat.formatRangeThe definition of 'formatRange()' in that specification.

Browser compatibility

Update compatibility data on GitHub

Desktop Mobile Server
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet Node.js
formatRange Chrome

Full support 76

Edge

No support No

Firefox

No support No

IE

No support No

Opera

No support No

Safari

No support No

WebView Android

Full support 76

Chrome Android

Full support 76

Firefox Android

No support No

Opera Android

Full support 54

Safari iOS

No support No

Samsung Internet Android

No support No

nodejs Full support 12.9.0

Notes'

Full support 12.9.0

Notes'

Notes' Before version 13.0.0, only the locale data for en-US is available by default. See the DateTimeFormat() constructor for more details.

Legend

Full support  
Full support
No support  
No support
See implementation notes.'
See implementation notes.


See also