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 Date
s 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.formatRange The definition of 'formatRange()' in that specification. |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Desktop | Mobile | Server | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|
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
|
Legend
- Full support
- Full support
- No support
- No support
- See implementation notes.
- See implementation notes.