Everything You Need to Know About Dates in JavaScript

Welcome to the crazy world of Javascript and Javascript Dates.

A Picture of my favourite month up there!!!

Now Mozilla Developers describe Date as

A JavaScript date is fundamentally specified as the number of milliseconds that have elapsed since midnight on January 1, 1970, UTC. This date and time is the same as the UNIX epoch, which is the predominant base value for computer-recorded date and time values.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date

Which is great, but date in Javascript can be a little tricky, I mean what isn't tricky in Javascript.

Getting Started with the Date Object

You can create a date with new Date(). There are four possible ways to use new Date():

const today = new Date();
// Sun Mar 15 2020 10:05:23 GMT+0530 (India Standard Time)

The date-string method

new Date('1988-04-5')
// Tue Apr 05 1988 00:00:00 GMT+0530 (India Standard Time

If I write 5-04-1988, you have no problems deducing it's 5th of April, 1988. Yeah? But if you write 5-04-1988 in JavaScript, you get Invalid Date.

(By the way, MDN warns against the date-string approach since browsers may parse date strings differently).

Creating dates with arguments

You can pass upto 7 arguments to the Date Constructor

/*
new Date(year, monthIndex [, day [, hours [, minutes [, seconds [, milliseconds]]]]])
*/
new Date(1988, 3, 5, 5, 25, 59)
// Tue Apr 05 1988 05:25:59 GMT+0530 (India Standard Time)
new Date(2017, 3, 22, 5, 23, 50)  
// This date can be easily read if you follow the left-right formula. 
// Year: 2017, 
// Month: April (because month is zero-indexed) 
// Date: 22 
// Hours: 05 
// Minutes: 23 
// Seconds: 50

Notice the monthIndex , the second argument is actually the index on a Month Array. Hence index “3” gives us the 4th month April.
The time returned however is localised as always since we haven’t specified a Timezone

Common Methods to use on a Date Object

Date has a lot of helpful methods to get date, month, year etc, and set a date relative to arguments .

Common formatting option you can use are:

const today = new Date();
today.toGMTString() OR parsedDate.toUTCString()
// "Sun, 15 Mar 2020 04:54:07 GMT"
today.toLocaleString()
// "15/03/2020, 10:24:07"
today.toDateString(), 
// "Sun Mar 15 2020"
today.toTimeString()
// "10:24:07 GMT+0530 (India Standard Time)"

It is also easy to get date, month and year from the date object

const today = new Date();
date = today.getDate();
// 15
year = today.getFullYear();
// 2020
month = today.getMonth();
// 2, this is the Month Index
today.setDate(20)
// Fri Mar 20 2020 10:28:58 GMT+0530 (India Standard Time)

const birthday = new Date('6/13/2018 06:27:39');

birthday.getMonth() // 5 (0 is January)
birthday.getDate() // 13
birthday.getDay() // 3 (0 is Sunday)
birthday.getFullYear() // 2018
birthday.getTime() // 1528838859000 (milliseconds since the Unix Epoch)
birthday.getHours() // 6
birthday.getMinutes() // 27
birthday.getSeconds() // 39
birthday.getTimezoneOffset() // -540 (time zone offset in minutes based on your browser's location)

Comparing dates

const earlier = new Date(2019, 0, 26)
const later = new Date(2019, 0, 27)

console.log(earlier < later) // true

Set the date at the beginning of the day

There are instances when you want to set the Date given to be set a 00.00 this is a great way to do it.

var today = new Date();
// Fri Mar 20 2020 10:28:58 GMT+0530 (India Standard Time)
today.setHours(0,0,0,0);
// Fri Mar 20 2020 00:00:00 GMT+0530 (India Standard Time)

Ping me if you have any questions. at @prikeshdexter

Checkout and Follow for more articles like these Prikesh Savla

Feel free to surprise me ☕

Prikesh Savla (@prikeshdexter) * Instagram photos and videos

Prikesh Savla - Medium

Prikesh