4

Is there a standard way in Javascript to get the localized date format for a given locale?

Here are some examples of what I'm looking for:

  • fr-FR -> jj/mm/aaaa
  • en-US -> mm/dd/yyyy
  • de-DE -> TT.mm.jjjj
  • etc.

I got those examples by looking at the placeholder of an <input type="date" /> after changing my browser's locale. So it appears the browser has this data somewhere. Is there a standard JS API or library that makes it accessible?

What I got so far

I can get the non-localized date format by using Intl.DateTimeFormat's formatToParts API.

function getDateFormat(locale) {
  return new Intl.DateTimeFormat(locale, {
    year: "numeric",
    month: "2-digit",
    day: "2-digit",
  })
    .formatToParts(new Date())
    .reduce((acc, part) => {
      const { type, value } = part;
      if (type === "year") {
        return acc + "YYYY";
      } else if (type === "month") {
        return acc + "MM";
      } else if (type === "day") {
        return acc + "DD";
      } else {
        return acc + value;
      }
    }, "");
}

This implementation does not account for the placeholder variations related to the locale (for locale fr-FR, "aaaa" should be used instead of "YYYY", etc.). Currently, I have to perform the mapping myself to get the localized version, which I'd like to avoid.

Backslash36
  • 755
  • 1
  • 13
  • 28
  • This question is quite similar to [this one](https://stackoverflow.com/a/54115358/979052), although no solution without using reduce was found – Alicia Sykes Dec 10 '22 at 16:52
  • This doesn't seem like a good idea. The format should match the language of the page being presented to the user, not the more–or–less random language of the browser. Having the format specified in language–specific characters and order means that the format must also be passed to the parser, either in the page or at the server, and the language–specific tokens translated into tokens that the parser will understand. That seems like unnecessary complexity with a high probability for errors. – RobG Dec 11 '22 at 11:15
  • @RobG The spec I'm describing matches [the behavior](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date#value) of ``, so I wouldn't say it's so far-fetched. Parsing the "localized" date into an ISO-8601 string is indeed not trivial, but it not as complicated as you make it out to be. Actually, if you rely on standard Intl APIs, it is not hard to come up with with a robust parser that works for any given locale. Not to mention libraries like `dayjs` that can do all the heavy lifting. – Backslash36 Dec 11 '22 at 12:48
  • The parsing part isn't an issue if you use a date input. However, not all browsers allow a format expression like dd/mm/yyyy as the placeholder for a date input, so you're back to an input type text and associated script if you want a language–specific format expression as the placeholder (and associated parsing issues). – RobG Dec 12 '22 at 12:35
  • Using an input text is indeed the goal – Backslash36 Dec 12 '22 at 12:51

0 Answers0