Format date to MM/dd/yyyy format in JavaScript

Handling unknown date strings and pesky timezones

When dealing with date strings as unpredictable as weather, JavaScript's Date object is your sturdy umbrella. Just be sure you account for timezone tricksters and non-standard format misfits:

function formatNonStandardDate(str) {
  // We all love Regex, right?
  const [ , month, day, year] = /(\d{1,2})\/(\d{1,2})\/(\d{4})/.exec(str);

  // Surprise! It's daytime... in UTC. 
  const date = new Date(Date.UTC(year, month - 1, day));

  // Ta-dah! The date looks familiar now
  return formatDate(date);
}

console.log(formatNonStandardDate('4/13/2021')); // *drumroll*... "04/13/2021"


One can't be humble when sending a date string through a blender and keeping its essence intact.

Intl.DateTimeFormat for the cosmopolitan coder

To keep the day from turning into night across locales, whip out your Intl.DateTimeFormat tool. It assures a MM/dd/yyyy framework adaptable to any locale preferences:

function formatDateIntl(d) {
  return new Intl.DateTimeFormat('en-US', {
    year: 'numeric', month: '2-digit', day: '2-digit'
  }).format(d);
}

console.log(formatDateIntl(new Date())); // Yep, it's still "MM/dd/yyyy"


And that, folks, is how you respect both local etiquette and formatting fidelity.

Modern times call for ES2017 methods

Who says you can't be modern with dates? Check out the game-changer String.prototype.padStart(), your ticket to uniform date formats:

function formatDateModern(d) {
  const pad = (n) => String(n).padStart(2, '0');
  return `${pad(d.getMonth() + 1)}/${pad(d.getDate())}/${d.getFullYear()}`;
}

console.log(formatDateModern(new Date())); // Bet you can guess... "MM/dd/yyyy"


Avoiding date traps: mm vs MM

Remember, details make or break the expert coder. Confusing mm (meant for minutes, not months) with MM can throw a timing wrench in your date formats.