The Daily TIL

February 23, 2019 by AndyAndyjavascriptlocalizationdates

There's an easy way to format human-readable dates

Dates are hard. They’re SUPER hard when you’re trying to display them to people based on where those people are located.

When working with dates in Javascript, the temptation is often to npm install moment --save and start looking up momentjs format strings.

Thanks, again, to MDN web docs, I found an easy and fairly well-supported way to display dates to users in any language.

Using Date.toLocaleString (and it’s sibling, toLocaleDateString, it’s pretty easy to display dates that are readable by humans, like February 20, 2019.


Test for browser support

Not all browsers support the locales and options parameters, so it’s a good idea to check for this.

function toLocaleStringSupportsLocales() {
  try {
    new Date().toLocaleString('i');
  } catch (e) {
    return e instanceof RangeError;
  return false;

Display a human readable date

If the current environment supports toLocaleDateString options, the following will return a string that looks like February 20, 2019.

const toHumanDate = date => {
  date = new Date(date);

  if (!toLocaleStringSupportsLocales()) {
    // Fall back to using default `toDateString` for the 
    // current locale.
    return date.toDateString();

  return date.toLocaleDateString('en-US', {
    day: 'numeric',
    month: 'long',
    year: 'numeric',