JavaScript date.toLocaleDateString(locales, options) method


The date.toLocaleDateString(locales, options) method in JavaScript is used to convert a Date object into a string, formatted according to the specified locales (language and region) and options. This method formats just the date part (year, month, day) based on locale conventions.

Syntax:

date.toLocaleDateString(locales, options);

Parameters:

  • locales (optional): A string or array of locale codes (e.g., 'en-US' for U.S. English, 'fr-FR' for French). It specifies the language and country format.
  • options (optional): An object that allows customization of the formatting. Some common options include:
    • year: "numeric", "2-digit"
    • month: "numeric", "2-digit", "long", "short", "narrow"
    • day: "numeric", "2-digit"
    • Additional options include weekday, era, timeZone, etc.

Returns:

  • A string representing the formatted date according to the locale and options provided.

Example 1: Default Formatting (U.S. English)

const date = new Date('2024-10-22'); console.log(date.toLocaleDateString());

Output:

10/22/2024

Explanation:

  • In this example, the date is formatted in the default locale (which may vary by environment). For U.S. English, the format is MM/DD/YYYY.

Example 2: Formatting with Locale (French)

const date = new Date('2024-10-22'); console.log(date.toLocaleDateString('fr-FR'));

Output:

22/10/2024

Explanation:

  • In French ('fr-FR'), the date is formatted as DD/MM/YYYY.

Example 3: Customizing the Format with Options

const date = new Date('2024-10-22'); const options = { year: 'numeric', month: 'long', day: 'numeric' }; console.log(date.toLocaleDateString('en-US', options));

Output:

October 22, 2024

Explanation:

  • The options object specifies the format: the month as "long" (full month name), year as "numeric", and day as "numeric". This gives the format "Month Day, Year".

Example 4: Custom Format with Weekday

const date = new Date('2024-10-22'); const options = { weekday: 'long', year: 'numeric', month: 'short', day: 'numeric' }; console.log(date.toLocaleDateString('en-GB', options));

Output:

Tuesday, 22 Oct 2024

Explanation:

  • The date is formatted with the full weekday name (Tuesday), short month name (Oct), and numeric day and year. The locale 'en-GB' (British English) arranges the date as Day, DD Month Year.

Example 5: Different Locale (Japanese Calendar)

const date = new Date('2024-10-22'); const options = { year: 'numeric', month: 'long', day: 'numeric', era: 'long' }; console.log(date.toLocaleDateString('ja-JP', options));

Output:

令和6年10月22日

Explanation:

  • In the Japanese calendar system ('ja-JP'), the date includes the era (e.g., 令和 for the Reiwa era), followed by the year, month, and day.

Example 6: Two-Digit Day and Month

const date = new Date('2024-10-22'); const options = { year: 'numeric', month: '2-digit', day: '2-digit' }; console.log(date.toLocaleDateString('en-US', options));

Output:

10/22/2024

Explanation:

  • By setting the month and day to "2-digit", the result ensures that single-digit months and days are padded with a leading zero.

Summary:

  • date.toLocaleDateString(locales, options) formats the date part of a Date object according to locale conventions.
  • It supports both locales for language-specific formats and options for custom formatting.
  • Useful for displaying dates in various formats based on region or user preference.