Date & Time in JavaScript

Whether you’re building a countdown timer, logging events, or displaying friendly timestamps, the built-in Date object has your back. Let’s explore how to create, read, and manipulate dates in a fun and friendly way!

Definition

In JavaScript, the Date object provides a way to work with dates and times. Under the hood, a Date stores a timestamp (the number of milliseconds since January 1, 1970 UTC), but it comes packed with methods to make your life easier.

const myDate = new Date();
console.log(myDate.toString()); // Outputs: Fri Aug 01 2025 12:32:31 GMT+0530 (India Standard Time)
console.log(typeof myDate); // Outputs: object

In above example, we can see that new Date() was used to create a Date Object with variable name myDate and output is a big long String with Day, Date, Time & Locale while the myDate variable itself is an Object.

However, you can see that all of the parts are combined in a single String. So, we have different ways to format these dates.

Formatting Strings

While toString() gives us a full timestamp, we can break it further or even localize it by using different String methods.

const myDate = new Date();
console.log(myDate.toString()); // Outputs: Fri Aug 01 2025 12:32:31 GMT+0530 (India Standard Time)
console.log(myDate.toDateString()); // Outputs: Fri Aug 01 2025
console.log(myDate.toTimeString()); // Outputs: 12:32:31 GMT+0530 (India Standard Time)
console.log(myDate.toLocaleString()); // Outputs: 8/1/2025, 12:32:31 PM
console.log(myDate.toLocaleTimeString()); // Outputs: 12:32:31 PM
console.log(myDate.toLocaleDateString()); // Outputs: 8/1/2025
console.log(myDate.toUTCString()); // Outputs: Fri, 01 Aug 2025 07:02:31 GMT
console.log(myDate.toISOString()); // Outputs: 2025-08-01T07:02:31.231Z

In above code example, we can see a lot of methods that prints different formats of Date. Here’s a small explanation of each method:

toString(): Prints the full date and time as a long string. It includes the day of the week, date, time, time zone, and your locale info.
Example: Fri Aug 01 2025 12:32:31 GMT+0530 (India Standard Time)
toDateString(): Prints only the date part in a simple readable format — day, month, and year.
Example: Fri Aug 01 2025
toTimeString(): Shows just the time part along with time zone details.
Example: 12:32:31 GMT+0530 (India Standard Time)
toLocaleString(): Displays the date and time together, formatted according to your system’s locale.
Example: 8/1/2025, 12:32:31 PM
toLocaleTimeString(): Shows only the time, again based on your locale settings.
Example: 12:32:31 PM
toLocaleDateString(): Prints only the date part in localized format.
Example: 8/1/2025
toUTCString(): Converts the date and time to Coordinated Universal Time (UTC). Great when working across time zones.
Example: Fri, 01 Aug 2025 07:02:31 GMT
toISOString(): Outputs the date and time in ISO 8601 format. This is especially useful for APIs and databases.
Example: 2025-08-01T07:02:31.231Z

Getting Specific Parts

Until now you learned different ways that we can format Date or Time, but what if you want a very specific part of date or time?

Let’s say you’re building an app and based on time you want to show greetings or maybe you want to change some theme based on the current month. How can we extract very specific parts from our Date?

const date = new Date();
console.log(date.getFullYear()); // Outputs 2025
console.log(date.getMonth()); // Outputs 7, (NOTE SEE LATER)
console.log(date.getDate()); // Outputs 1, current date
console.log(date.getHours()); // Outputs 14, Current hour
console.log(date.getMinutes()); // Outputs 13, Current Minutes
console.log(date.getDay()); // Outputs 5, current day no of week

Let’s quickly break these down:

getFullYear() — Gives you the 4-digit year (like 2025).
getMonth( — Returns the month as a number from 0 to 11. So 0 is January, 7 is August, etc.
getDate() — This gives you the day of the month, from 1 to 31.
getDay() — Returns the day of the week, where 0 = Sunday, 1 = Monday, and so on.
getHours(), getMinutes(), and getSeconds() — These give you exactly what you’d expect: the current hour, minutes, and seconds of the time stored in your Date object.

These methods are super helpful when you want to build something like a custom clock, date picker, or just show a personalized greeting like “Good morning! It’s Friday, August 1st!”

NOTE: Months in JavaScript starts from 0, just like index in String. So date.getMonth() + 1 will give you the correct month as per the calendar.

Creating Custom Dates

So far, we’ve been using new Date() with no arguments, which just gives us the current date and time. But you can also create custom dates which are super useful when you’re working with deadlines, birthdays, or events.

const date1 = new Date(2025, 7, 1); // August 1, 2025
const date2 = new Date(2025, 7, 1, 15, 30, 0); // August 1, 2025, 3:30 PM
const date3 = new Date("2025-08-1") // creating a date in yyyy-mm-dd format

In above examples, we created date by passing year, month and day. We also saw that we can pass formats like YYYY-mm-dd as well. You can run all type of Date methods on them as discussed earlier.

However there’s a small thing that I would like you to notice in the above example. In case of date1 and date2, the month of August is 7, however when we create YYYY-mm-dd format, we use 8 as month for August.

Here’s a Gotcha! When you create a date using format YYYY-mm-dd or any other similar format, then we pass actual month number, in our case 8 for August, but whenever we create a date without a format like in date1 and date2, we pass real_month - 1, in other words 7 for August as in this case, the months start from 0.

More ways of creating custom dates

If you see above examples, you might think well these are very rigid ways of making dates. Right? But we do have some easy ways to create new dates as well.

let parsedTimeStamp = Date.parse("February 21, 2002"); // number (milliseconds)
let parsedDate = new Date(someday); // convert milliseconds to date object

// create direct date, no need to parse.
const d1 = new Date("Jan 25, 2001");
const d2 = new Date("27 Mar 2015");
const d3 = new Date("2016 November 5");

In above example, you can see that how easy it is to create a new date. We don’t even need to follow YYYY-mm-dd format, we can literally use name of the months, date and year directly and in any order to create a new date.

Comparing Dates

JavaScript lets you compare dates just like numbers because behind the scenes, a date is really just a big number (milliseconds since 1970).

Let’s see how we can compare two dates:

const now = new Date();
const future = new Date('2025-12-31');
console.log(now < future); // true — present is before future
console.log(now > future); // false — present is not after future

In above example, we can clearly see that it is that simple to just compare two separate dates. This is really important when building software. For Example, you might build an app with subscription, where you might want to check if the user’s premium window has ended or not.

Conversion between Date and Milliseconds

From what we’ve learned so far, we know that a date in JavaScript can either exist as a Date object or as a timestamp (the number of milliseconds since January 1, 1970, UTC).

In the previous section on comparing dates, we compared two Date objects directly. But what happens if the two dates are in different forms i.e. one as a Date object and the other as a timestamp?

Hmm, That’s an interesting question and one worth discussing about!

In most real-world applications, dates are commonly stored as timestamps (in milliseconds). This format makes it easier to save, transmit, and compare dates across systems and databases.

const date = new Date(); // Date Object
const timestamp = date.getTime(); // Convert Date -> timestamp (milliseconds)

console.log(timestamp); // Outputs: 1759755083308

const newDate = new Date(timestamp); // Convert timestamp -> Date
console.log(newDate.toString()); // Sat Nov 05 2016 00:00:00 GMT+0530 (India Standard Time)

In the example above, we start with a Date object and use the .getTime() method to convert it into a timestamp. Logging the timestamp variable shows the number of milliseconds that represent that date.

Now to convert from a timestamp back to a Date object, we simply pass the timestamp into the Date() constructor. This gives us a new Date instance with the same date and time information.

With this understanding, you can easily convert between these two formats, making date comparisons and storage much simpler in real-world applications.

🧵 Wrapping It Up

Now, working with Date or Time, is no longer tricky for you. With the knowledge about how to format, compare and create custom dates, you can build some really awesome software in future since handling Date & Time is crucial for every software you might think of.