How to Format Dates in JavaScript Without a Library

Date formatting is one of those things that looks simple until you actually try to do it. JavaScript gives you a Date object with all the raw pieces — day, month, year, hours, minutes — but getting those pieces into a format that looks right for your users takes a bit of work.

The good news is you do not need Moment.js, date-fns, or any other library to format dates cleanly. The built-in tools JavaScript provides are more than enough for most real-world needs. Let’s walk through how to use them.

The Date Object: What You’re Working With

Every date in JavaScript starts with the Date object. Creating one is straightforward:

const now = new Date();
console.log(now); // Wed Aug 26 2026 14:32:00 GMT+0000

That default output is rarely what you want to show a user. Your job is to pull out the specific parts you need and arrange them the way you want.

Getting the Individual Parts

The Date object has methods for extracting each piece:

const date = new Date();

const day = date.getDate();          // 1–31
const month = date.getMonth();       // 0–11 (January is 0)
const year = date.getFullYear();     // e.g. 2026
const hours = date.getHours();       // 0–23
const minutes = date.getMinutes();   // 0–59
const seconds = date.getSeconds();   // 0–59

The most important thing to remember: getMonth() is zero-indexed. January is 0, December is 11. Always add 1 when you want to display the month number.

const month = date.getMonth() + 1; // Now January = 1, December = 12

Building a Simple Date Formatter

Once you have the individual parts, you can arrange them however you like. Here is a reusable function that returns dates in MM/DD/YYYY format:

function formatDate(date) {
  const day = String(date.getDate()).padStart(2, "0");
  const month = String(date.getMonth() + 1).padStart(2, "0");
  const year = date.getFullYear();

  return `${month}/${day}/${year}`;
}

console.log(formatDate(new Date())); // "08/26/2026"

padStart(2, "0") adds a leading zero to single-digit days and months so you get “08” instead of “8”. That one line is what separates a polished output from a sloppy one.

Common Date Formats

Here are the most common formats you will need, all using the same approach:

YYYY-MM-DD (ISO format — great for databases and APIs)

function toISODate(date) {
  const day = String(date.getDate()).padStart(2, "0");
  const month = String(date.getMonth() + 1).padStart(2, "0");
  const year = date.getFullYear();

  return `${year}-${month}-${day}`;
}

console.log(toISODate(new Date())); // "2026-08-26"

DD/MM/YYYY (common outside the US)

function toDDMMYYYY(date) {
  const day = String(date.getDate()).padStart(2, "0");
  const month = String(date.getMonth() + 1).padStart(2, "0");
  const year = date.getFullYear();

  return `${day}/${month}/${year}`;
}

console.log(toDDMMYYYY(new Date())); // "26/08/2026"

Month DD, YYYY (human-readable)

function toLongDate(date) {
  const months = [
    "January", "February", "March", "April", "May", "June",
    "July", "August", "September", "October", "November", "December"
  ];

  const day = date.getDate();
  const month = months[date.getMonth()];
  const year = date.getFullYear();

  return `${month} ${day}, ${year}`;
}

console.log(toLongDate(new Date())); // "August 26, 2026"

Formatting Time

For 12-hour time with AM/PM:

function formatTime(date) {
  let hours = date.getHours();
  const minutes = String(date.getMinutes()).padStart(2, "0");
  const ampm = hours >= 12 ? "PM" : "AM";

  hours = hours % 12 || 12; // Convert 0 to 12 for midnight

  return `${hours}:${minutes} ${ampm}`;
}

console.log(formatTime(new Date())); // "2:32 PM"

For 24-hour time:

function formatTime24(date) {
  const hours = String(date.getHours()).padStart(2, "0");
  const minutes = String(date.getMinutes()).padStart(2, "0");

  return `${hours}:${minutes}`;
}

console.log(formatTime24(new Date())); // "14:32"

Using toLocaleDateString() for Easy Formatting

JavaScript has a built-in method called toLocaleDateString() that handles formatting for you based on locale and options. It is cleaner for display purposes when you want locale-aware output.

const date = new Date();

// US format
console.log(date.toLocaleDateString("en-US"));
// "8/26/2026"

// UK format
console.log(date.toLocaleDateString("en-GB"));
// "26/08/2026"

// With full options
console.log(date.toLocaleDateString("en-US", {
  weekday: "long",
  year: "numeric",
  month: "long",
  day: "numeric"
}));
// "Wednesday, August 26, 2026"

The options object gives you fine-grained control. Here are the key options:

For time, use toLocaleTimeString() the same way:

const date = new Date();

console.log(date.toLocaleTimeString("en-US", {
  hour: "numeric",
  minute: "2-digit",
  hour12: true
}));
// "2:32 PM"

Combining Date and Time

To display a full timestamp:

function formatDateTime(date) {
  const day = String(date.getDate()).padStart(2, "0");
  const month = String(date.getMonth() + 1).padStart(2, "0");
  const year = date.getFullYear();

  let hours = date.getHours();
  const minutes = String(date.getMinutes()).padStart(2, "0");
  const ampm = hours >= 12 ? "PM" : "AM";
  hours = hours % 12 || 12;

  return `${month}/${day}/${year} ${hours}:${minutes} ${ampm}`;
}

console.log(formatDateTime(new Date())); // "08/26/2026 2:32 PM"

Or use toLocaleString() for both in one call:

const date = new Date();

console.log(date.toLocaleString("en-US", {
  month: "long",
  day: "numeric",
  year: "numeric",
  hour: "numeric",
  minute: "2-digit",
  hour12: true
}));
// "August 26, 2026 at 2:32 PM"

A Reusable Format Utility

Here is a single utility function that handles multiple output formats from one call:

function formatDate(date, format = "MM/DD/YYYY") {
  const day = String(date.getDate()).padStart(2, "0");
  const month = String(date.getMonth() + 1).padStart(2, "0");
  const year = date.getFullYear();

  const formats = {
    "MM/DD/YYYY": `${month}/${day}/${year}`,
    "DD/MM/YYYY": `${day}/${month}/${year}`,
    "YYYY-MM-DD": `${year}-${month}-${day}`,
  };

  return formats[format] || formats["MM/DD/YYYY"];
}

console.log(formatDate(new Date(), "YYYY-MM-DD")); // "2026-08-26"
console.log(formatDate(new Date(), "DD/MM/YYYY")); // "26/08/2026"
console.log(formatDate(new Date(), "MM/DD/YYYY")); // "08/26/2026"

Pass in the date and the format string you want. Add more format options to the object as you need them.

Tips for Working With Dates in JavaScript

Always use getFullYear(), never getYear(). The getYear() method is deprecated and returns inconsistent values. getFullYear() always returns the four-digit year.

Remember getMonth() is zero-indexed. This trips up everyone at least once. January is 0. Always add 1 before displaying.

Use padStart() for clean output. Single-digit days and months look wrong without a leading zero in most formats. padStart(2, "0") fixes it in one line.

For user-facing dates, prefer toLocaleDateString(). It handles locale differences automatically and produces output that feels natural to your users’ region.

For APIs and databases, use ISO format. YYYY-MM-DD is the universal standard for machine-readable dates. Always use it when passing dates between systems.