In this guide, we will explore various techniques to accomplish the task of adding days to a date in JavaScript.

We will cover different methods, including using built-in JavaScript functions and leveraging popular libraries, to understand the options available comprehensively.

Introduction to add days to date JavaScript

In JavaScript, adding days to date is a fundamental operation when working with dates and time-based calculations. Whether you need to perform date manipulations, implement scheduling functionality, or handle time-sensitive operations, the capability to add days to date is essential.

This guide caters to novice programmers seeking a strong foundation in date manipulation. And also experienced developers looking to expand their repertoire of date-related operations.

How to add days in date JavaScript?

To add days to a date in JavaScript, you can use the Date object and various methods available.

Here’s an example to add 1 day to date in JavaScript:


let currentDate = new Date();  // Get the current date
console.log("Current date: ", currentDate);

let numberOfDaysToAdd = 1;  // Number of days to add

// Add the specified number of days to the current date
currentDate.setDate(currentDate.getDate() + numberOfDaysToAdd);  

// Output the updated date
console.log(`Added ${numberOfDaysToAdd} day to date: `, currentDate);

//output: 
//Current date:  Fri May 26 2023 17:03:15 GMT+0530 (India Standard Time)
//Added 1 days to date:  Sat May 27 2023 17:03:15 GMT+0530 (India Standard Time)  

Note: The Date, time and timezone will be displayed depending on your location.

In this example, we create a new Date object representing the current date.

Then, we specify the number of days to add using the numberOfDaysToAdd variable. Using the setDate() method of the Date object, we add a specific number of days to the current date.

Finally, we output the updated date using console.log().

An alternative way to add days to date in JavaScript

Apart from the method mentioned earlier, there are a few alternative ways to add days to a date in JavaScript.

Here are a couple of additional approaches-

1. Using the getTime() and setTime() methods

Here is an example to add 3 days to date in JavaScript

let currentDate = new Date();  // Get the current date

let numberOfDaysToAdd = 3;  // Number of days to add

// Add the specified number of milliseconds to the current date
let updatedDate = new Date(
                           currentDate.getTime() + 
                           numberOfDaysToAdd * 24 * 60 * 60 * 1000);  

console.log(updatedDate);  // Output the updated date

// Output: Wed May 31 2023 17:16:22 GMT+0530 (India Standard Time)

In this approach, we convert the current date to milliseconds using the getTime() method.

Then, we add the specified number of days multiplied by the number of milliseconds in a day (24 hours * 60 minutes * 60 seconds * 1000 milliseconds).

Finally, we create a new Date object with the updated milliseconds using the setTime() method.

2. Add days to date JavaScript using the moment.js library

The moment.js is a popular date and time manipulation library.

If you have the moment.js library included in your project, you can use its convenient methods to add days to a date.

Here’s an example:


import moment from 'moment';

// Get the current date using moment.js
let currentDate = moment();  

let numberOfDaysToAdd = 5;  // Number of days to add

// Add the specified number of days to the current date
let updatedDate = currentDate.add(numberOfDaysToAdd, 'days');  

console.log(updatedDate);  // Output the updated date

Note: Make sure you do npm install moment --save before running the code.

Also if you get error similar to this “(node:14840) Warning: To load an ES module, set “type”: “module” in the package.json or use the .mjs extension.
(Use `node –trace-warnings …` to show where the warning was created)”

Then go to your pacakge.json file and add “type”: “module” and save it.
How to fix warning To load an ES module set type module in the package json or use the mjs extension

 

Finally, you run the command to run the date(js) file in the terminal. Below is the reference image showing the output-

output in vs code terminal showing add days to date in javascript

More Examples of JavaScript Date Add Days

Let’s see a few more examples that we usually face while working with adding dates to days. To solve these examples we can use any one approach that suits your need. Here we are going to use the very basic

Q1. Add 3 days to date javascript

// Step 1: Create a new Date object for the current date
let currentDate = new Date();

// Step 2: Use the setDate() method to add 3 days to the current date
currentDate.setDate(currentDate.getDate() + 3);

// Step 3: Retrieve the updated date components
let updatedYear = currentDate.getFullYear();
let updatedMonth = currentDate.getMonth() + 1; // Adding 1 to get the correct month (January is 0)
let updatedDay = currentDate.getDate();

// Step 4: Format the updated date in a desired format (e.g., "YYYY-MM-DD")
let formattedDate = updatedYear + '-' + (updatedMonth < 10 ? '0' : '') 
                   + updatedMonth + '-' + (updatedDay < 10 ? '0' : '') 
                   + updatedDay;

// Step 5: Print the updated date
console.log("Updated date: " + formattedDate);

In this code, we create a new Date object for the current date. Then we use the setDate() method to add 3 days to the current date. After that, we retrieve the updated date components (year, month, and day).

Then we format the updated date in the desired format (in this case, “YYYY-MM-DD”), and finally, we print the updated date using console.log().

Please note that this code assumes the current date is the starting point. If you have a specific date you want to start with, you can create the Date object with that date instead of using new Date().

Q2. Add 7 days to date JavaScript

With a small change in the number in step 2 .i.e the number of days. We can modify the previous example code to add 7 days to date.

currentDate.setDate(currentDate.getDate() + 7);

Q3. Add 30 days to date JavaScript

To add 30 days to date in JavaScript is also the same.

currentDate.setDate(currentDate.getDate() + 30);

3. Add days to date javascript in dd/mm/yyyy

Sometimes it is required for us to add days to date using JavaScript in dd/mm/yyyy format. Therefore, we will see how we can do that in this last example. Note: We will be using the same basic approach using setDate and getDate methods in Js.


// Step 1: Create a new Date object for the given date in the format "dd/mm/yyyy"
let givenDate = "17/06/2023";
let [givenDay, givenMonth, givenYear] = givenDate.split("/");
let currentDate = new Date(givenYear, givenMonth - 1, givenDay); // Month is 0-based in JavaScript

// Step 2: Use the setDate() method to add 3 days to the current date
currentDate.setDate(currentDate.getDate() + 3);

// Step 3: Retrieve the updated date components
let updatedDay = currentDate.getDate();
let updatedMonth = currentDate.getMonth() + 1; // Adding 1 to get the correct month (January is 0)
let updatedYear = currentDate.getFullYear();

// Step 4: Format the updated date in the "dd/mm/yyyy" format
let formattedDate = `${updatedDay}/${updatedMonth}/${updatedYear}`;

// Step 5: Print the updated date
console.log("Updated date: " + formattedDate);

In this updated code, we start by declaring the givenDate variable with the input date in the format “dd/mm/yyyy”.

Then we split the given date into its day, month, and year components.

After that, we create a new Date object using the given day, month (subtracting 1 as months are 0-based in JavaScript), and year.

Next, we use the setDate() method to add 3 days to the current date. We retrieve the updated day, month (adding 1 to adjust for the 0-based index), and year components.

Finally, we format the updated date in the “dd/mm/yyyy” format and print it using console.log().