Intl.DateTimeFormat : méthode formatRange()

Baseline Widely available

Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis août 2021.

La méthode formatRange() des instances de Intl.DateTimeFormat formate un intervalle de dates de la façon la plus concise possible selon les locales et options fournies lors de l'instanciation de cet objet Intl.DateTimeFormat.

Exemple interactif

const options1 = {
  weekday: "long",
  year: "numeric",
  month: "long",
  day: "numeric",
};
const options2 = { year: "2-digit", month: "numeric", day: "numeric" };

const startDate = new Date(Date.UTC(2007, 0, 10, 10, 0, 0));
const endDate = new Date(Date.UTC(2008, 0, 10, 11, 0, 0));

const dateTimeFormat = new Intl.DateTimeFormat("en", options1);
console.log(dateTimeFormat.formatRange(startDate, endDate));
// Résultat attendu : "Wednesday, January 10, 2007 — Thursday, January 10, 2008"

const dateTimeFormat2 = new Intl.DateTimeFormat("en", options2);
console.log(dateTimeFormat2.formatRange(startDate, endDate));
// Résultat attendu : "1/10/07 — 1/10/08"

Syntaxe

formatRange(startDate, endDate)

Paramètres

startDate: Début de l'intervalle de dates. Peut être un objet Date ou Temporal.PlainDateTime. Il peut également s'agir d'un objet Temporal.PlainTime, Temporal.PlainDate, Temporal.PlainYearMonth ou Temporal.PlainMonthDay si l'objet DateTimeFormat a été configuré pour afficher au moins une partie pertinente de la date.

Note : Un objet Temporal.ZonedDateTime provoquera toujours une exception TypeError ; utilisez Temporal.ZonedDateTime.prototype.toLocaleString() ou convertissez-le en objet Temporal.PlainDateTime à la place.
endDate: Fin de l'intervalle de dates. Doit être du même type que startDate.

Valeur de retour

Une chaîne de caractères représentant l'intervalle de dates donné, formatée selon la locale et les options de format de cet objet Intl.DateTimeFormat. Si les dates de début et de fin sont équivalentes à la précision de la sortie, la sortie ne contiendra qu'une seule date.

Exemples

Utilisation simple de `formatRange()`

Cette méthode reçoit deux objets Date et formate l'intervalle de dates de la façon la plus concise possible selon la locale et les options fournies lors de l'instanciation de Intl.DateTimeFormat.

const date1 = new Date(Date.UTC(1906, 0, 10, 10, 0, 0)); // Wed, 10 Jan 1906 10:00:00 GMT
const date2 = new Date(Date.UTC(1906, 0, 10, 11, 0, 0)); // Wed, 10 Jan 1906 11:00:00 GMT
const date3 = new Date(Date.UTC(1906, 0, 20, 10, 0, 0)); // Sat, 20 Jan 1906 10:00:00 GMT

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

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

Spécifications

Specification
ECMAScript® 2026 Internationalization API Specification # sec-intl.datetimeformat.prototype.formatRange

Compatibilité des navigateurs

Voir aussi

L'objet Intl.DateTimeFormat

Help improve MDN

Learn how to contribute

Cette page a été modifiée le 27 févr. 2026 par les contributeurs du MDN.

View this page on GitHub • Report a problem with this content