How to add months to a date in JavaScript?


To add months to a date in JavaScript, you can use the Date.setMonth() method. JavaScript date setMonth() method sets the month for a specified date according to local time. This method takes two parameters first is the number of months and the second parameter is the number of days. The counting of the month is start from 0, for example, 0 represents January, 1 represents February ... and so on.

Syntax

Date.setMonth(monthsValue , [daysValue]);

Note − Parameters in the bracket are always optional.

Parameter Detail

  • monthsValue − An integer between 0 and 11, representing the months. Although we can also use the number bigger than 11 or less than 0. For example, -1 represents the last month of the previous year, and 12 represents the first month of the next year.

  • daysValue − An integer between 1 and 31, representing the day of the month. If you specify the daysValue parameter, you must also specify the monthsValue. You can also specify the number bigger than 31 and less than 1. For example, 0 represents the last day of the previous month, and -1 represents the day before the last day of the previous month. 32 represents the first day of the next month.

Algorithm

STEP 1 − First we get the current date or define a date and display it.

STEP 2 − Next we get the month of the current date using the getMonth() method.

STEP 3 − Define the number of months to be added.

STEP 4 − Set the month of the date using the setMonth() and display the updated date.

To add months into the Date object using the setMonth() method first we get the value of months of the current Date using the getMonth() method and then add a number of months into it and pass the added value to the setMonth() method.

Example

In the below example, we add 3 months to the current date, and display the current date, and updated date. We use the getMonth() and setMonth() methods to get current month and set new month.

<html>
   <body>
      <p> Add 3 months to the current date/time.</p>
      <p id="currentTime">Current Date : </p>
      <p id="updatedTime">Updated Date: </p>
         <script>
            let dt = new Date();
            document.getElementById("currentTime").innerText += dt
            let no_of_months = 3;
            dt.setMonth(dt.getMonth() + no_of_months)
            document.getElementById("updatedTime").innerText += dt;
         </script>
   </body>
</html>

Example

In the example below, we take the date as "August 20, 2023 11:30:25". We add two months to this date. We display both- the previous and updated dates.

<html>
   <body>
      <p> Add 2 months to the current date/time.</p>
      <p id="currentTime">Old Date : </p>
      <p id="updatedTime">Updated Date: </p>
      <script>
         let dt = new Date("August 20, 2023 11:30:25");
         document.getElementById("currentTime").innerText += dt
         let no_of_months = 2;
         dt.setMonth(dt.getMonth() + no_of_months)
         document.getElementById("updatedTime").innerText += dt;
      </script>
   </body>
</html>

Example

In this example, we are adding 4 months to the current Date. We display the current and updated date in MM/DD/YYYY format.

<!DOCTYPE html>
<html>
   <body>
      <p> Click on the button to add 4 months to the current date (MM/DD/YYYY).</p>
      <button onclick="add()">Click Me</button>
      <p id="currentTime">Current Date : </p>
      <p id="updatedTime">Updated Date: </p>
      <script>
         // Code the show current time
         let ct = document.getElementById("currentTime")
         let currentDate = Date.now();
         ct.innerText += new Date(currentDate).toLocaleDateString()
         
         // Code to add 3 Months to current Time
         let ut = document.getElementById("updatedTime")
         function add() {
            let dt = new Date();
            let no_of_months = 4;
            dt.setMonth(dt.getMonth() + no_of_months)
            ut.innerText += dt.toLocaleDateString();
         }
      </script>
   </body>
</html>

Note − The formatting of the date is MM/DD/YYYY.

In this tutorial, we have discussed how to add months to a date. We use two methods for this purpose. One is the getMonth() method to get the month of the date. And second is the setMonth() method to set the month of the date with a new month.

Updated on: 22-Oct-2023

24K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements