JavaScript toLocaleDateString(): Localized Date Formatting

Date.prototype.toLocaleDateString() returns a locale-aware string for the date portion of a Date in the local time zone by default. You can supply a locale and formatting options, including a named timeZone.

Syntax:

date.toLocaleDateString();
date.toLocaleDateString(locales, options);

Example:

const date = new Date("2026-09-10T12:00:00Z");
console.log(date.toLocaleDateString("en-IN"));

Choose a locale
Control the displayed parts
Use dateStyle
Format in a named time zone
Compare with toDateString()
Reuse Intl.DateTimeFormat
Format to parts
Common mistakes

Choosing a Locale Top ↑

The locale controls language and regional conventions. Do not hard-code a visual order such as DD/MM/YYYY by manually rearranging strings when the goal is localized display.

const date = new Date(2026, 8, 10);
console.log(date.toLocaleDateString("en-IN"));
console.log(date.toLocaleDateString("en-US"));
console.log(date.toLocaleDateString("de-DE"));

Controlling Year, Month, Day and Weekday Top ↑

const options = {
  weekday: "long",
  year: "numeric",
  month: "long",
  day: "numeric"
};

console.log(new Date().toLocaleDateString("en-IN", options));

Using dateStyle for Common Formats Top ↑

dateStyle provides predefined levels such as full, long, medium, and short.

const date = new Date();
console.log(date.toLocaleDateString("en-IN", { dateStyle: "full" }));

Formatting the Same Instant in a Named Time Zone Top ↑

The Date stores an instant. The timeZone option lets you display its calendar date in a specified IANA zone instead of relying on the visitor’s computer zone.

const instant = new Date("2026-09-10T20:30:00Z");
console.log(instant.toLocaleDateString("en-IN", { timeZone: "Asia/Kolkata" }));
console.log(instant.toLocaleDateString("en-US", { timeZone: "America/New_York" }));

toLocaleDateString() vs toDateString() Top ↑

toDateString() gives a simple implementation-defined English-like date representation and accepts no locale/options. toLocaleDateString() is designed for user-facing localization.

Reusing Intl.DateTimeFormat for Many Dates Top ↑

When formatting many dates with the same locale and options, create one Intl.DateTimeFormat formatter and reuse it rather than repeatedly asking toLocaleDateString() to resolve the same formatting data.

const formatter = new Intl.DateTimeFormat("en-IN", {
  dateStyle: "medium",
  timeZone: "Asia/Kolkata"
});

const dates = [new Date(), new Date(Date.now() + 86400000)];
for (const date of dates) {
  console.log(formatter.format(date));
}

Formatting into Parts Top ↑

If you need to style or reorder semantic pieces without parsing a localized string, use Intl.DateTimeFormat().formatToParts().

const formatter = new Intl.DateTimeFormat("en-IN", { day: "2-digit", month: "short", year: "numeric" });
console.log(formatter.formatToParts(new Date()));

Common toLocaleDateString() Mistakes Top ↑

Assuming the default locale/time zone is identical for every user.
Parsing the localized output back into a Date.
Hard-coding locale-sensitive separators or field order.
Creating a new formatter repeatedly inside a large loop when the options never change.

Next: toTimeString() Date Reference

Subhendu Mohapatra

Author & Instructor at plus2net

I write and maintain practical tutorials on Python, PHP, SQL, JavaScript, HTML, jQuery, and web development at plus2net. The tutorials focus on clear explanations, working examples, and code that readers can test and adapt while learning.

About the author Watch on YouTube

Connect: