Kodeclik Blog
How to get yesterday’s date (or tomorrow’s date) in Javascript
We will learn how to compute and modify dates in your Javascript program, specifically how to programmatically obtain yesterday’s and tomorrow’s dates To understand how to do this, we will write and embed our Javascript code inside a HTML page like so:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Computing dates in Javascript</title>
</head>
<body>
<script>
</script>
</body>
</html>In the above HTML page you see the basic elements of the page like the head element containing the title ("Computing dates in Javascript") and a body with an empty script tag. Any HTML markup goes inside the body tags and any Javascript code goes inside the script tags.
Find today’s date
Let us first try to write a program to print and reason about today’s date. We can use the “new Date()” constructor to obtain a Date object containing the current date and time. Here is a simple Javascript program that initializes a Date object and then writes it out into your HTML page:
<script>
const today = new Date()
document.write(today)
document.write("<BR>")
</script>The output will be (depending on the day you read this blogpost and/or run this program):
Tue Jul 19 2022 07:13:35 GMT-0400 (Eastern Daylight Time)Note that the Date object contains the time as well as the date.
If you would like to extract the day, month,and year specifically, we can use methods like getDate, getMonth, and getYear:
<script>
const today = new Date()
document.write("Day is: " + today.getDate() + "<BR>")
document.write("Month is: " + today.getMonth() + "<BR>")
document.write("Year is: " + today.getYear() + "<BR>")
</script>The output is:
Day is: 19
Month is: 6
Year is: 122Wow - what happened? The Day is correct but the Month and Year are not quite right. The reason the getMonth() output appears incorrect is that it counts months from 0 so the “6” actually denotes the 7th month, viz. July. The getYear() output appears incorrect because it counts years from the year 1900. Thus, 122 is really 1900+122 = 2022. In general, getYear() is deprecated. Instead we must use getFullYear(). Here’s the updated code to account for all of the above:
<script>
const today = new Date()
document.write("Day is: " + today.getDate() + "<BR>")
document.write("Month is: " + today.getMonth()+1 + "<BR>")
document.write("Year is: " + today.getFullYear() + "<BR>")
</script>The output is now:
Day is: 19
Month is: 61
Year is: 2022The year is fixed now but the month is still not quite right. This is because the getMonth()+1 essentially does string concatenation and hence the output of “6” is concatenated with “1” to obtain 61. To fix this, we need to do a simple update to our code as follows:
<script>
const today = new Date()
document.write("Day is: " + today.getDate() + "<BR>")
document.write("Month is: " + (today.getMonth()+1) + "<BR>")
document.write("Year is: " + today.getFullYear() + "<BR>")
</script>The output is:
Day is: 19
Month is: 7
Year is: 2022Here, getMonth() returns an integer so that the “+1” is interpreted as integer addition whereas in the earlier code it was in the larger context of string concatenation. This is why the output is exactly what we need, i.e., 19th July 2022.
Find yesterday’s date
Now we need to update our code to find yesterday’s date. One approach is to subtract one day from the Date, see if it crosses a month threshold and in that case, update the month, and so on to see if we will need to update the year. This can make for some cumbersome code. An easier approach is to convert the date to seconds, then subtract the seconds corresponding to a year, and then reconstructing the date.
In the below code, we will use the getTime() method which returns the number of milliseconds since January 1, 1970 00:00:00.
<script>
const today = new Date()
const todays_time_stamp = today.getTime()
document.write("Time is: " + today.getTime() + "<BR>")
</script>The output is:
Time is: 1658237809377Now let us find yesterday’s date by subtracting one day’s worth of seconds. Then we use the Date() constructor again to obtain the date in traditional date format. Here is a program to accomplish this objective:
<script>
const today = new Date()
const todays_time_stamp = today.getTime()
const ydays_time_stamp = todays_time_stamp - 24*60*60*1000
const yday = new Date(ydays_time_stamp)
document.write("Today: " + today + "<BR>")
document.write("Yesterday: " + yday + "<BR>")
</script>As we can see once we obtain today’s time stamp we subtract 24*60*60*1000 worth of milliseconds. The output is:
Today: Tue Jul 19 2022 09:40:56 GMT-0400 (Eastern Daylight Time)
Yesterday: Mon Jul 18 2022 09:40:56 GMT-0400 (Eastern Daylight Time)Find tomorrow’s date
Now that we have gone through the above exercise, finding tomorrow’s date is simple. We just need to update the calculations accordingly:
<script>
const today = new Date()
const todays_time_stamp = today.getTime()
const tomorrows_time_stamp = todays_time_stamp + 24*60*60*1000
const tomorrow = new Date(tomorrows_time_stamp)
document.write("Today: " + today + "<BR>")
document.write("Tomorrow: " + tomorrow + "<BR>")
</script>The output is:
Today: Tue Jul 19 2022 09:43:31 GMT-0400 (Eastern Daylight Time)
Tomorrow: Wed Jul 20 2022 09:43:31 GMT-0400 (Eastern Daylight Time)We have learnt how to work with dates in Javascript, including finding yesterday’s date and tomorrow’s date programmatically. How will you make use of these capabilities?
If you liked this blogpost, checkout our blogpost on finding your current time zone programmatically in Javascript! Also learn a handy way to subtract dates in Javascript.
Interested in learning more Javascript? Learn how to loop through two Javascript arrays in coordination and how to make a Javascript function return multiple values!
Want to learn Javascript with us? Sign up for 1:1 or small group classes.
