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.