How to Add Seconds to a Date in JavaScript

1. Date setSeconds() and getSeconds() Methods

To add seconds to a date in JavaScript, use the getSeconds() method to get the seconds, then call the setSeconds() method on the date, passing as an argument the sum of getSeconds() and the number of seconds to add.

For example:

function addSeconds(date, seconds) {
  date.setSeconds(date.getSeconds() + seconds);
  return date;
}

// 12:00:00 AM on April 17, 2022
const date = new Date('2022-04-17T00:00:00.000Z');

// 12:00:20 AM on April 17, 2022
const newDate = addSeconds(date, 20);

console.log(newDate); // 2022-04-17T00:00:20.000Z

Our addSeconds() function takes a Date object and the seconds to add as arguments. It returns a new Date object with the newly added seconds.

The Date getSeconds() method returns a number between 0 and 59 that represents the seconds of a particular date.

The Date setSeconds() sets the seconds of a date to a specified number.

If the seconds added would increase the minutes, hour, day, or year of the Date, setSeconds() automatically updates the Date information to reflect this.

// 12:00:00 AM on April 17, 2022
const date = new Date('2022-04-17T00:00:00.000Z');

// Add 100 seconds to date
date.setSeconds(date.getSeconds() + 100);

// 12:01:40 AM on April 17, 2022
console.log(date); // 2022-04-17T00:01:40.000Z

In this example, passing 100 to setSeconds() increments the minutes of the date by 1 (60 seconds) and sets the seconds to 40.

Avoiding Side Effects

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

function addSeconds(date, seconds) {
  // Making a copy with the Date() constructor
  const dateCopy = new Date(date);
  dateCopy.setSeconds(date.getSeconds() + seconds);

  return dateCopy;
}

const date = new Date('2022-04-17T00:00:00.000Z');

const newDate = addSeconds(date, 20);
console.log(newDate); // 2022-04-17T00:00:20.000Z

// Original not modified
console.log(date); // 2022-04-17T00: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. This makes it a good practice to limit the number of side effects in your programs.

2. date-fns addSeconds()

Alternatively, you can use the pure addSeconds() function from the date-fns NPM package to quickly add seconds to a date in JavaScript.

import { addSeconds } from 'date-fns';

const date = new Date('2022-04-17T00:00:00.000Z');

const newDate = addSeconds(date, 20);
console.log(newDate); // 2022-04-17T00:00:20.000Z

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


Every Crazy Thing JavaScript Does

A captivating guide to the subtle caveats and lesser-known parts of JavaScript.

Every Crazy Thing JavaScript Does

Sign up and receive a free copy immediately.


Leave a Comment

Your email address will not be published. Required fields are marked *