Dates and times in JavaScript
If you’re a developer, you’re bound to use JavaScript dates and times sooner or later! Learn all about them in this article…

If you’re a developer, you’re bound to use JavaScript dates and times sooner or later! Learn all about them in this article…
Getting started
I highly recommend following along in this article! It’ll help you understand and remember the concepts better. To get started, create this HTML file and then open it up in your browser:
<html>
<head>
<title>Dates and times in JavaScripttitle>
head>
<body>
<script>
// Exciting code coming soon!
script>
body>
html>
If you want to try out some JavaScript, you can put it in the tag, save, reload the page and see what happens! In this tutorial, I’ll be using
console.log
— this prints stuff to the console so you can see it. To open up the console:
- Right-click
- Go to ‘Inspect Element’
- Go to the ‘Console’ tab
You’re all set up now! Enjoy…
Why are dates useful?
Often when building websites or web applications, you’ll want to do something related to time. Convert an ugly date into a readable format, find durations, convert between time zones, print a date in the user’s local format and more.
You can do all that with the JavaScript Date
object!
In JavaScript, times (hours, minutes, seconds, milliseconds) are all considered part of the ‘date’. So for the rest of this article, when I’m talking about the ‘date’, remember that it includes the time (unless I tell you otherwise, of course).
Creating a new Date object
To create a new date object, we can call new Date()
:
var myDate = new Date();
This will let us do a bunch of calculations to do with dates and times.
If you leave the brackets empty, it’ll automatically set this date object to the current date/time. We can see this by console.log
ging it!
var myDate = new Date();
console.log(myDate);
// Output: Mon Jan 28 2019 08:40:07 GMT+1100 (Australian Eastern Daylight Time)
// Output may be different for you
That’s what it shows for me right now, here in Australia (dates are in your timezone by default), as I’m writing this. Obviously, it will be different for you. Try it out!
When you console.log
a Date
object, the output contains the date (Mon Jan 28 2019
), followed by the time (08:40:07
), followed by the timezone (GMT+1100
) and timezone name (Australian Eastern Daylight Time
). As you can see, it also adjusts the timezone for daylight savings time.
You can also create a Date
object set to a particular date (not the current one). I’ll tell you about this later in the article, once you’re more familiar with some date concepts!
Timestamps
A timestamp is one number that represents the current date and time. In JavaScript, this is the number of milliseconds since it was midnight on Jan 1, 1970 (and you can have negative numbers to get a date before that). Because of time zones, it’s slightly more confusing.
It’s actually the number of milliseconds since it was midnight on Jan 1, 1970 in Greenwich, England — where the timezone is GMT (Greenwich Mean Time), also known as UTC (Coordinated Universal Time). So if your timezone was 2 hours behind Greenwich, then the timestamp 0
would actually be 10pm on Dec 31, 1969 in your timezone.
It’s a bit confusing, but all you really need to remember is that a timestamp is a unique number in milliseconds that represents the current date and time.
Let’s get a timestamp from our Date
object! We do this using .getTime()
…
var myDate = new Date();
console.log(myDate.getTime());
// Output: 1548625207000
// Output may be different for you
We can also set the date object to a particular timestamp using .setTime()
. Let’s set it to the timestamp 0
, then console.log
it:
var myDate = new Date();
myDate.setTime(0);
console.log(myDate);
// Output: Thu Jan 01 1970 10:00:00 GMT+1000 (Australian Eastern Standard Time)
// Output may be different for you
As you can see, we’ve changed the time that myDate
is storing.
Like I was saying before, the timestamp 0
will be different depending on your timezone. If your timezone is GMT, it will be exactly 00:00:00
. But here my timezone is AEST, which is 10 hours ahead of Greenwich. So for me, the timestamp 0
is 10:00:00 (10am) on Jan 1, 1970. Try the code above yourself, to see what the timestamp 0
would be in your timezone!
You can try getting our myDate
object to store any date — even in the future!
var myDate = new Date();
myDate.setTime(9999999999999);
console.log(myDate);
// Output: Sun Nov 21 2286 04:46:39 GMT+1100 (Australian Eastern Daylight Time)
// Output may be different for you
Wow!! That’s pretty far into the future!
Getting the duration between two timestamps
To get the duration (in milliseconds) between two timestamps, we can simply subtract one from the other! To make sure the answer is always positive (because you can’t have a negative duration), you can use Math.abs
:
var myDate1 = new Date();
var myDate2 = new Date();
myDate2.setTime(1541325072000);
console.log(Math.abs(myDate1.getTime() - myDate2.getTime()));
// Output: 7300135000
// Output may be different for you
Getting/setting parts of the Date object
The Date
object is so useful because of how many things you can do with it! The functions below let you get different bits of information about our date…
.getDate()
getDate
gets the day of the month — here’s an example!
var myDate = new Date();
console.log(myDate.getDate());
// Output: 28
// Output may be different for you
You can also change the day of the month using myDate.setDate(yourNumber)
.
.getDay()
getDay
gets the day of the week. Sunday is represented as 0
, Monday as 1
, etc.
var myDate = new Date();
console.log(myDate.getDay());
// Output: 1
// Output may be different for you
If you want to show the name instead of the number, you can do it using an array:
var myDate = new Date();
var daysOfWeek = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
console.log(daysOfWeek[myDate.getDay()]);
// Output: Monday
// Output may be different for you
.getMonth()
getMonth
returns a number representing the month. 0
is January, 11
is December…
var myDate = new Date();
console.log(myDate.getMonth());
// Output: 0
// Output may be different for you
Again, if you want to show the name instead of the number, you can do it using an array:
var myDate = new Date();
var months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
console.log(months[myDate.getMonth()]);
// Output: January
// Output may be different for you
You can also change the day of the month number using myDate.setMonth(yourNumber)
.
.getFullYear()
getFullYear
simply gets the current year number! Try it out…
var myDate = new Date();
console.log(myDate.getFullYear());
// Output: 2019
// Output may be different for you
You can set the year using myDate.setFullYear(yourNumber)
.
Wait a sec! Why is it getFullYear
, not getYear
?
Apa Reaksimu?






