How to Add Months to a Date in JavaScript

1. Date getMonth() and setMonth() methods

To add months to a Date in JavaScript:

1. Call the getMonth() to get the number of months.
2. Add the new months.
3. Pass the sum to the setMonth() method.

For example:

function addMonths(date, months) {
  date.setMonth(date.getMonth() + months);

  return date;
}

// May 17, 2022
const date = new Date('2022-05-17T00:00:00.000Z');

const newDate = addMonths(date, 4);

// September 17, 2022
console.log(newDate); // 2022-09-17T00:00:00.000Z

Our addMonths() takes a Date object and the number of months to add as arguments. It returns the same Date object with the newly added months.

The Date getMonth() returns a zero-based number that represents the month of a particular date.

The Date setMonth() method sets the months of a date to a specified zero-based number.

Note: “Zero-based” here means that 0 is January, 1 is February, 2 is March, etc.

If the months added would increase the year of the Date, setMonth() will automatically update the information in the Date object to reflect this.

// November 12, 2022
const date = new Date('2022-11-12T00:00:00.000Z');

date.setMonth(date.getMonth() + 3);

// February 12, 2023
console.log(date); // 2023-02-12T00:00:00.000Z

Here we added 3 months to a date in November 2022. This makes setMonth() automatically update the year to 2023.

Avoid side effects

The setMonth() method mutates the Date object it is called on. This introduces a side effect in our addMonths() function. To avoid modifying the passed Date and create a pure function, make a copy of the Date and call setMonth() on this copy, instead of the original.

function addMonths(date, months) {
  // 👇 Make copy with "Date()" constructor
  const dateCopy = new Date(date);

  dateCopy.setMonth(dateCopy.getMonth() + months);

  return dateCopy;
}

// August 16, 2022
const date = new Date('2022-08-16T00:00:00.000Z');

const newDate = addMonths(date, 3);

// November 16, 2022
console.log(newDate); // 2022-11-16T00:00:00.000Z

// 👇 Original not modified
console.log(date); // 2022-08-16T00:00:00.000Z

Tip: Functions that don’t modify external state (i.e., pure functions) tend to be more predictable and easier to reason about, as they always give the same output for a particular input. This makes it a good practice to limit the number of side effects in your code.

2. date-fns addMonths() function

Alternatively, we can use the addMonths() function from the date-fns library to quickly add months to a Date. It works like our pure addMonths() function.

import { addMonths } from 'date-fns';

// July 14, 2022
const date = new Date('2022-07-14T00:00:00.000Z');

const newDate = addMonths(date, 1);

// August 14, 2022
console.log(newDate); // 2022-08-14T00:00:00.000Z

// Original not modified
console.log(date); // 2022-07-14T00:00:00.000Z

11 Amazing New JavaScript Features in ES13

This guide will bring you up to speed with all the latest features added in ECMAScript 13. These powerful new features will modernize your JavaScript with shorter and more expressive code.