In this article, we’ll learn how to easily add any number of weeks to a Date
object in JavaScript.
1. Date setDate() and getDate() methods
To add weeks to a Date
in JavaScript:
- Use the
getDate()
method on theDate
to get the day of the month of theDate
. - Add the result of
getDate()
to7
multiplied by the number of weeks to add. - Call the
setDate()
method with this sum as an argument.
For example:
function addWeeks(date, weeks) {
date.setDate(date.getDate() + 7 * weeks);
return date;
}
// May 20, 2022
const date = new Date('2022-05-20T00:00:00.000Z');
const newDate = addWeeks(date, 1);
// May 27, 2022
console.log(newDate); // 2022-05-27T00:00:00.000Z
Our addDays()
function takes a Date
object and the number of days to add as arguments, and returns the same Date
object with the newly added days.
The Date
getDate()
method returns a number between 1 and 31 that represents the day of the month of the particular date.
The Date
setDate()
method changes the day of the month of the Date
object to the number passed as an argument.
If the number you specify would change the month or year of the Date
, setDate()
automatically updates the Date
information to reflect this.
function addWeeks(date, weeks) {
date.setDate(date.getDate() + 7 * weeks);
return date;
}
// May 20, 2022
const date = new Date('2022-05-20T00:00:00.000Z');
const newDate = addWeeks(date, 3);
// June 10, 2022
console.log(newDate); // 2022-06-10T00:00:00.000Z
Adding 3 weeks adds 21 days (20 + 21 = 41 days), but May has only 31 days, so the month is incremented by 1
and the day is set to 10
(41 – 31).
Avoid side effects
The setDate()
method mutates the Date
object it is called on. This introduces a side effect into our addDays()
function. To avoid modifying the passed Date
and create a pure function, make a copy of the Date
and call setDate()
on this copy, instead of the original.
function addWeeks(date, weeks) {
const dateCopy = new Date(date);
dateCopy.setDate(dateCopy.getDate() + 7 * weeks);
return dateCopy;
}
const date = new Date('2022-05-20T00:00:00.000Z');
const newDate = addWeeks(date, 3);
console.log(newDate); // 2022-06-10T00:00:00.000Z
// Original not modified
console.log(date); // 2022-05-20T00:00:00.000Z
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 addWeeks() function
Alternatively, you can use the pure addWeeks()
function from the date-fns NPM package to quickly add weeks to a Date
. It works similarly to our addWeeks()
function.
import { addWeeks } from 'date-fns';
const date = new Date('2022-05-20T00:00:00.000Z');
const newDate = addWeeks(date, 3);
console.log(newDate); // 2022-06-10T00:00:00.000Z
// Original not modified
console.log(date); // 2022-05-20T00: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.