Javascript Date and Time in Detail

Learn about date and time in Javascript by creating some cool 😎 stuffs

Javascript has a built-in Date object to handle all the time and date related operations. For example, you can display the current date/time, create a calendar, build a Pomodoro timer, code out a 🛑 stop-watch, and much more.

Creating a Date Object

We can create a Date object using the new operator.

This method returns the current date with the time and timezone.

There are 3 other ways to create a Date when using the new keyword:

1. Creating a Date object with milliseconds

We can create a date object by passing the Date object a timestamp number in milliseconds. For example, new Date(1572840117245).

When we create a date object by passing it 0 milliseconds, it will return the date object for Jan 01 1970 05:30:00. This is the Linux Epoch date/time.

Computers’ time are based on Linux Epoch(Jan 01 1970 05:30:00).

Since zero milliseconds corresponds to this starting point, any value larger is the number of milliseconds since the Linux Epoch.

Note: If the concept of the Linux Epoch is confusing, then keep reading. We’ll see further in the article how we can get the current timestamp from the epoch in JS. Using the Linux Epoch time is a very common technique in programming because it gives us an exact reference point for comparison.

Let’s extend this demonstration further. There are 31 days in January and 24 hours for each day and 60 mins for each hour and 60 sec for each minute and 1000 milliseconds for each second.

So, let’s pass 31 * 24 * 60 * 60 * 1000 = 2678400000 to the Date object. As expected, the result is Feb 1 of 1970 which is a month after the Linux Epoch.

2. Creating a Date object by passing each value

3. Creating Date object using dateString

We can create a Date object by passing the string representation of the date. The string representation is accepted if it is able to be parsed using Date.parse().

The allowed format is YYYY-MM-DDTHH:mm:ss.sssZ

YYYY → year

MM → month

DD → day

T → date and time separator

HH → hours

mm → minutes

ss →seconds

sss → milliseconds

Z → Timezone

Using the Date Object Methods to Get and Update a Date

The Date object that we created in the last section provides many methods to get and update (set) dates.

First, let’s learn the get methods:

Examples

We can change the date by using the set methods on the Date object.

Examples

Tricks for the Date Object

1. To get the current time in milliseconds, we can use the Date.now method which will return the total milliseconds since the Linux Epoch.

Date.now(); // 1572840117245

Using that time, you can call new Date(1572840117245) and you will see that it corresponds to the current date.

2. To get a formatted string, use the toDateString method:

var dt = new Date(22,5,1997);

dt.toDateString() // Sun Jun 22 1997

3. Find the total number of days in a month in Javascript.

We need to create a function that takes month (months are indexed as 0–11 in JS) and a year as an argument, and we need to return the number of days in that month.

When we create a Date object with year and month, the day of the month is set to 1.

So if we pass new Date(5,2019) then it returns a date object for 1st June 2019.

There can be no month which can have more that 31 days. So if we set the date as 32, then

• If the current month has 31 days → it points to next month first day,
• If the current month has 30 days → it points to next month second day,
• If the current month has 29 days → it points to next month third day,
• If the current month has 28 days → it points to next month fourth day,

Example:

var d = new Date(2019, 0, 32); // Feb 01 2019

d.getDate(); // 1 (because Jan 2019 has 31 days)

var d = new Date(2019, 1, 32); Mar 04 2019

d.getDate(); // 4 (because Feb 2019 has 28 days)

If we again subtract the current date from 32 then we get the number of days in the month provided.

So let’s create a function that returns the number of days when we pass the year and month:

And those are the key features of the Date object in JavaScript!

If you find this helpful surprise 🎁 me here.

Share if you feel happy.

Follow Javascript Jeep🚙 if you feel worthy.