Hobbyist coder here, and this problem is above my pay grade. I'm trying to build a dynamic html / css calendar, where the cells are filled in based on today's date. I get today's date, and then try to add days to fill in another 13 days (looping thru html elements.innerHTML).
If I try to setDate(30 + 2) and then getDate(). The code works fine. Javascript figures out that June ends at the 30th day, and the result is 2 as desired (July 2nd)
But this only works if there's only one call, if I have a loop, or call this code multiple times, then the result is different. Is there some async stuff gumming up the works? Here's code:
If you leave the "result2" call and comment the others, works great, but multiple calls, things break and numbers get repeated. Please help!
const theDate = new Date();
const todaysDate = 30;
theDate.setDate(todaysDate + 1);
let result1 = theDate.getDate();
theDate.setDate(todaysDate + 2);
let result2 = theDate.getDate();
theDate.setDate(todaysDate + 3);
let result3 = theDate.getDate();
theDate.setDate(todaysDate + 4);
let result4 = theDate.getDate();
console.log(result1);
console.log(result2);
console.log(result3);
console.log(result4);
June has 30 days but July has 31 days.
When you set the date to 32 for the first time, you are setting it to the 32nd of June and the dates after June 30 push it to July 2nd. (32-30=2)
When you set to 32 again, it is already July so the dates after July 31 push it to August 1st (32-31=1).
In answer to your question, the setDate() function is behaving so strangely for you because each time you are setting the date you are setting it relative to the previous setting, so incrementing each time by 31, 32, or 33 days instead of by 1, 2, or 3. See the brilliant answer by #Quentin for more information, this finding was entirely his and I just wanted to mention the root cause in my answer as well as my own fix to your problem.
An alternative solution if you just want to generate the dates:
const dayOfMonth = 30;
const date = new Date();
date.setDate(dayOfMonth);
console.log("Date:", date);
let timestamp = Date.parse(date);
for (let i = 1; i <= 14; i++) {
const newTimestamp = timestamp + i * (1000 * 60 * 60 * 24);
const newDate = new Date(newTimestamp);
console.log("New date:", newDate);
}
This method will manipulate the timestamp and generate new dates for each of the timestamps added to the number of milliseconds in a day.
You could use your date logic within the loop to populate the calendar as you mentioned.
If you use the Date() constructor on each iteration, you don't have to worry about the varying days of a particular month.
Details are commented in example
/**
* #desc - return a range of dates starting today (or a given
* date) and a given number of days (including start)
* #param {number} range - The number of days
* #param {string<date>} start - The date to start the range
* if not defined #default is today
* #return {array<date>} An array of dates
*/
function dayRange(range, start) {
// If undefined default is today
let now = start ? new Date(start) : new Date();
// Create an array of empty slots - .length === range
let rng = [...new Array(range)];
/*
.map() through array rng
If it's the first iteration add today's date...
... otherwise get tommorow's date...
and return it in local format
*/
return rng.map((_, i) => {
if (i === 0) {
return now.toLocaleDateString();
}
let day = now.getDate() + 1;
now.setDate(day);
return now.toLocaleDateString();
});
}
console.log("Pass the first parameter if the start day is today");
console.log(JSON.stringify(dayRange(14)));
console.log("Pass a properly formatted date string as the second parameter if you want to start on a date other than today");
console.log(JSON.stringify(dayRange(10, '05/12/2020')));
I am using google sheets where there is a duration value of 69:41:00 where it's 69 hours, 41 minutes, 0 secs. There doesn't seem to be a function to convert this to days, hours and minutes so I did some searching and some had suggested a custom function. Not sure exactly how it works but made some changes from the original to fit what I needed. The code below:
/**
* Format Duration to Days,Hours,Minutes
*
* #param {duration} input value.
* #return Days,Hours,Minutes.
* #customfunction
*/
function FormatDuration(duration) {
// Retrieve the hours and minutes
var hrs = duration.getHours();
var days = Math.floor(hrs/24);
var hours = hrs % 24;
var mins = duration.getMinutes();
// Convert the result to a number to use in calculations
var result = days + 'd ' + hours + ' h '+ mins+' min';
return result;
}
The result should be 2d 21h 44 min but instead I got 0d 21 h 35 min. Am I doing something wrong here?
I was going to add, why don't you just use a custom format of
ʺd\d hh\h mm\mʺ ?
This works fine in Excel but not in GS because it uses a different base for dates so duration like 69:41:00 would be interpreted as 1/1/1900 21:41 and the days are not correct. So you would have to break it down into days (whole numbers) and hours+minutes (fractions of a day) like this
=text(int(A1),ʺ#0\d ʺ)&text(mod(A1,1),ʺHH\h MM\mʺ)
You can make it work in Google Scripts if you want to by adjusting the date - should work OK for durations up to 1 month.
The reason for adding 2 to the date is that a time like 03:21:00 (less than a day) is seen as a date - namely 30th December 1899 ! So I add 2 to it to make it 1st January 1900. However, now the day part of the date is 1 and I want it to be zero. So I have to subtract 1 from the day further down.
This strange behaviour is probably why you're advised to do it the other way and work in milliseconds, but I was just interested to see if there was a way of making the original code work.
/**
* Format Duration to Days,Hours,Minutes
*
* #param {duration} input value.
* #return Days,Hours,Minutes.
* #customfunction
*/
function FormatDuration(duration) {
// Add 2 days to the date
var date=new Date(duration.setDate(duration.getDate()+2));
Logger.log(date.getDate());
var hours = duration.getHours();
// Take 1 off the day part of the date
var days = date.getDate()-1;
var mins = duration.getMinutes();
// Convert the result to a number to use in calculations
var result = days + 'd ' + hours + ' h '+ mins+' min';
return result;
}
function(durations){
var timeArr = durations.split(':'); //["69","41","00"]
//your code
}
getHours is a method of object Date.
var t = new Date;
t.getHours();
How do you expect to get more than 24hours from a Date object? It is not the same as what you expect as Duration. Date is for points of time in calendar, so at most you'd get the 23:59:59 of any day. You can get date2 - date1 = milliseconds diff, and work on it, as following;
function FormatDuration(date1, date2) {
var milliseconds = date2 - date1;
var mins = Math.floor((milliseconds / (1000*60)) % 60);
var hours = Math.floor((milliseconds / (1000*60*60)) % 24);
var days = Math.floor(milliseconds / (1000*60*60*24));
var result = days + ' d ' + hours + ' h '+ mins + ' min';
console.log(result);
}
FormatDuration(new Date(2000, 5, 1, 5, 13, 0, 0),
new Date(2000, 5, 2, 15, 31, 0, 0))
You can find more details here
I'd like to get a Date object which is 30 minutes later than another Date object. How do I do it with JavaScript?
Using a Library
If you are doing a lot of date work, you may want to look into JavaScript date libraries like Datejs or Moment.js. For example, with Moment.js, this is simply:
var newDateObj = moment(oldDateObj).add(30, 'm').toDate();
Vanilla Javascript
This is like chaos's answer, but in one line:
var newDateObj = new Date(oldDateObj.getTime() + diff*60000);
Where diff is the difference in minutes you want from oldDateObj's time. It can even be negative.
Or as a reusable function, if you need to do this in multiple places:
function addMinutes(date, minutes) {
return new Date(date.getTime() + minutes*60000);
}
And just in case this is not obvious, the reason we multiply minutes by 60000 is to convert minutes to milliseconds.
Be Careful with Vanilla Javascript. Dates Are Hard!
You may think you can add 24 hours to a date to get tomorrow's date, right? Wrong!
addMinutes(myDate, 60*24); //DO NOT DO THIS
It turns out, if the user observes daylight saving time, a day is not necessarily 24 hours long. There is one day a year that is only 23 hours long, and one day a year that is 25 hours long. For example, in most of the United States and Canada, 24 hours after midnight, Nov 2, 2014, is still Nov 2:
const NOV = 10; //because JS months are off by one...
addMinutes(new Date(2014, NOV, 2), 60*24); //In USA, prints 11pm on Nov 2, not 12am Nov 3!
This is why using one of the afore-mentioned libraries is a safer bet if you have to do a lot of work with this.
Below is a more generic version of this function that I wrote. I'd still recommend using a library, but that may be overkill/impossible for your project. The syntax is modeled after MySQL DATE_ADD function.
/**
* Adds time to a date. Modelled after MySQL DATE_ADD function.
* Example: dateAdd(new Date(), 'minute', 30) //returns 30 minutes from now.
* https://stackoverflow.com/a/1214753/18511
*
* #param date Date to start with
* #param interval One of: year, quarter, month, week, day, hour, minute, second
* #param units Number of units of the given interval to add.
*/
function dateAdd(date, interval, units) {
if(!(date instanceof Date))
return undefined;
var ret = new Date(date); //don't change original date
var checkRollover = function() { if(ret.getDate() != date.getDate()) ret.setDate(0);};
switch(String(interval).toLowerCase()) {
case 'year' : ret.setFullYear(ret.getFullYear() + units); checkRollover(); break;
case 'quarter': ret.setMonth(ret.getMonth() + 3*units); checkRollover(); break;
case 'month' : ret.setMonth(ret.getMonth() + units); checkRollover(); break;
case 'week' : ret.setDate(ret.getDate() + 7*units); break;
case 'day' : ret.setDate(ret.getDate() + units); break;
case 'hour' : ret.setTime(ret.getTime() + units*3600000); break;
case 'minute' : ret.setTime(ret.getTime() + units*60000); break;
case 'second' : ret.setTime(ret.getTime() + units*1000); break;
default : ret = undefined; break;
}
return ret;
}
Working jsFiddle demo.
var d1 = new Date (),
d2 = new Date ( d1 );
d2.setMinutes ( d1.getMinutes() + 30 );
alert ( d2 );
var oldDateObj = new Date();
var newDateObj = new Date();
newDateObj.setTime(oldDateObj.getTime() + (30 * 60 * 1000));
console.log(newDateObj);
var now = new Date();
now.setMinutes(now.getMinutes() + 30); // timestamp
now = new Date(now); // Date object
console.log(now);
Maybe something like this?
var d = new Date();
var v = new Date();
v.setMinutes(d.getMinutes()+30);
console.log(v)
I always create 7 functions, to work with date in JS:
addSeconds, addMinutes, addHours, addDays, addWeeks, addMonths, addYears.
You can see an example here: http://jsfiddle.net/tiagoajacobi/YHA8x/
How to use:
var now = new Date();
console.log(now.addMinutes(30));
console.log(now.addWeeks(3));
These are the functions:
Date.prototype.addSeconds = function(seconds) {
this.setSeconds(this.getSeconds() + seconds);
return this;
};
Date.prototype.addMinutes = function(minutes) {
this.setMinutes(this.getMinutes() + minutes);
return this;
};
Date.prototype.addHours = function(hours) {
this.setHours(this.getHours() + hours);
return this;
};
Date.prototype.addDays = function(days) {
this.setDate(this.getDate() + days);
return this;
};
Date.prototype.addWeeks = function(weeks) {
this.addDays(weeks*7);
return this;
};
Date.prototype.addMonths = function (months) {
var dt = this.getDate();
this.setMonth(this.getMonth() + months);
var currDt = this.getDate();
if (dt !== currDt) {
this.addDays(-currDt);
}
return this;
};
Date.prototype.addYears = function(years) {
var dt = this.getDate();
this.setFullYear(this.getFullYear() + years);
var currDt = this.getDate();
if (dt !== currDt) {
this.addDays(-currDt);
}
return this;
};
One line code
var afterSomeMinutes = new Date(new Date().getTime() + minutes * 60000);
where minutes is a number
Stop using Moment.js
As recommended by other great answers, in most cases it's best to use a library when dealing dates. However, it's important to know that as of September 2020 Moment.js is considered legacy and should no longer be used in new projects.
Quoting Moment's statement in their official docs:
We would like to discourage Moment from being used in new projects going forward. [...] We now generally consider Moment to be a legacy project in maintenance mode. It is not dead, but it is indeed done.
Modern libraries
Below are alternatives recommended by Moment.
Luxon
Luxon can be thought of as the evolution of Moment. It is authored by Isaac Cambron, a long-time contributor to Moment. Please read Why does Luxon exist? and the For Moment users pages in the Luxon documentation.
Locales: Intl provided
Time Zones: Intl provided
import {DateTime} from 'luxon'
function addMinutes(date, minutes) {
return DateTime.fromJSDate(date).plus({minutes}).toJSDate()
}
Day.js
Day.js is designed to be a minimalist replacement for Moment.js, using a similar API. It is not a drop-in replacement, but if you are used to using Moment's API and want to get moving quickly, consider using Day.js.
Locales: Custom data files that can be individually imported
Time Zones: Intl provided, via a plugin
import dayjs from 'dayjs'
function addMinutes(date, minutes) {
return dayjs(date).add(minutes, 'minutes').toDate()
}
date-fns
Date-fns offers a series of functions for manipulating JavaScript Date objects. For more details, scroll to "Why date-fns?" on the date-fns home page.
Locales: Custom data files that can be individually imported
Time Zones: Intl provided, via a separate companion library
import {addMinutes} from 'date-fns'
function addMinutesDemo(date, minutes) {
return addMinutes(date, minutes)
}
js-Joda
js-Joda is a JavaScript port of Java's Three-Ten Backport, which is the base for JSR-310 implementation of the Java SE 8 java.time package. If you are familiar with java.time, Joda-Time, or Noda Time, you will find js-Joda comparable.
Locales: Custom data files via add-on module
Time Zones: Custom data files via add-on module
import {LocalDateTime, nativeJs, convert} from '#js-joda/core'
function addMinutes(date, minutes) {
return convert(
LocalDateTime.from(
nativeJs(date)
).plusMinutes(minutes)
).toDate()
}
One-liner no utilities:
new Date(+new Date() + 60000*15) // +15 minutes
The easiest way to solve is the to recognize that in javascript dates are just numbers. It starts 0 or 'Wed Dec 31 1969 18:00:00 GMT-0600 (CST). Every 1 represents a millisecond. You can add or subtract milliseconds by getting the value and instantiating a new date using that value. You can manage it pretty easy with that mind.
const minutesToAdjust = 10;
const millisecondsPerMinute = 60000;
const originalDate = new Date('11/20/2017 10:00 AM');
const modifiedDate1 = new Date(originalDate.valueOf() - (minutesToAdjust * millisecondsPerMinute));
const modifiedDate2 = new Date(originalDate.valueOf() + (minutesToAdjust * millisecondsPerMinute));
console.log(originalDate); // Mon Nov 20 2017 10:00:00 GMT-0600 (CST)
console.log(modifiedDate1); // Mon Nov 20 2017 09:50:00 GMT-0600 (CST)
console.log(modifiedDate2); // Mon Nov 20 2017 10:10:00 GMT-0600 (CST)
This is what I do which seems to work quite well:
Date.prototype.addMinutes = function(minutes) {
var copiedDate = new Date(this.getTime());
return new Date(copiedDate.getTime() + minutes * 60000);
}
Then you can just call this like this:
var now = new Date();
console.log(now.addMinutes(50));
You should get the value of the current date to get the date with (ms) and add (30 * 60 *1000) to it. Now you have (current date + 30 min) with ms
console.log('with ms', Date.now() + (30 * 60 * 1000))
console.log('new Date', new Date(Date.now() + (30 * 60 * 1000)))
it is simple as it is;
let initial_date = new Date;
let added30Min = new Date(initial_date.getTime() + (30*60*1000));
Here is the ES6 version:
let getTimeAfter30Mins = () => {
let timeAfter30Mins = new Date();
timeAfter30Mins = new Date(timeAfter30Mins.setMinutes(timeAfter30Mins.getMinutes() + 30));
};
Call it like:
getTimeAfter30Mins();
Here is my one-liner:
console.log('time: ', new Date(new Date().valueOf() + 60000))
I feel many of the answers here are lacking a creative component, very much needed for time travel computations. I present my solution for a temporal translation of 30 minutes.
(jsfiddle here)
function fluxCapacitor(n) {
var delta,sigma=0,beta="ge";
(function(K,z){
(function(a,b,c){
beta=beta+"tT";
switch(b.shift()) {
case'3':return z('0',a,c,b.shift(),1);
case'0':return z('3',a,c,b.pop());
case'5':return z('2',a,c,b[0],1);
case'1':return z('4',a,c,b.shift());
case'2':return z('5',a,c,b.pop());
case'4':return z('1',a,c,b.pop(),1);
}
})(K.pop(),K.pop().split(''),K.pop());
})(n.toString().split(':'),function(b,a,c,b1,gamma){
delta=[c,b+b1,a];sigma+=gamma?3600000:0;
beta=beta+"im";
});
beta=beta+"e";
return new Date (sigma+(new Date( delta.join(':')))[beta]());
}
You could do this:
let thirtyMinutes = 30 * 60 * 1000; // convert 30 minutes to milliseconds
let date1 = new Date();
let date2 = new Date(date1.getTime() + thirtyMinutes);
console.log(date1);
console.log(date2);
Here is the IsoString version:
console.log(new Date(new Date().setMinutes(new Date().getMinutes() - (30))).toISOString());
var add_minutes = function (dt, minutes) {
return new Date(dt.getTime() + minutes*60000);
}
console.log(add_minutes(new Date(2014,10,2), 30).toString());
One way to 'add' 30 minutes is to create a second date object (mostly for demonstration) and set the minutes to minutes + 30. This will account for adjusting the hour as well if the first time is less than 30 minutes from the next hour. (i.e., 4:45 to 5:15)
const first = new Date();
console.log("first date :", first.toString());
const second = new Date(first);
const newMinutes = second.getMinutes() + 30;
console.log("new minutes:", newMinutes);
second.setMinutes(newMinutes);
console.log("second date:", second.toString());
I know that the topic is way too old. But I am pretty sure that there are some developpers who still need this, so I made this simple script for you.
I hope you enjoy it!
Hello back, It's 2020 and I've added some modification hope it will help a lot better now!
Hello again, It is 2022 and I came back again to fix some issues and give a better naming for the methods & functions.
function addTimeToDate(addedTime, date){
let generatedTime = date.getTime();
if(addedTime.seconds) generatedTime += 1000 * addedTime.seconds; //check for additional seconds
if(addedTime.minutes) generatedTime += 1000* 60 * addedTime.minutes;//check for additional minutes
if(addedTime.hours) generatedTime += 1000 * 60 * 60 * addedTime.hours;//check for additional hours
return new Date(generatedTime);
}
Date.prototype.addTime = function(addedTime){
return addTimeToDate(addedTime, this);
}
let futureDate = new Date().addTime({
hours: 16, //Adding one hour
minutes: 45, //Adding fourty five minutes
seconds: 0 //Adding 0 seconds return to not adding any second so we can remove it.
});
<button onclick="console.log(futureDate)">Travel to the future</button>
Use an existing library known to handle the quirks involved in dealing with time calculations. My current favorite is moment.js.
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.js"></script>
<script>
var now = moment(); // get "now"
console.log(now.toDate()); // show original date
var thirty = moment(now).add(30,"minutes"); // clone "now" object and add 30 minutes, taking into account weirdness like crossing DST boundries or leap-days, -minutes, -seconds.
console.log(thirty.toDate()); // show new date
</script>
Other solution:
var dateAv = new Date();
var endTime = new Date(dateAv.getFullYear(), dateAv.getMonth(), dateAv.getDate(), dateAv.getHours(), dateAv.getMinutes() + 30);
let d = new Date();
d.setMinutes(d.getMinutes() + 30);
// console.log(d)
For the lazy like myself:
Kip's answer (from above) in coffeescript, using an "enum", and operating on the same object:
Date.UNIT =
YEAR: 0
QUARTER: 1
MONTH: 2
WEEK: 3
DAY: 4
HOUR: 5
MINUTE: 6
SECOND: 7
Date::add = (unit, quantity) ->
switch unit
when Date.UNIT.YEAR then #setFullYear(#getFullYear() + quantity)
when Date.UNIT.QUARTER then #setMonth(#getMonth() + (3 * quantity))
when Date.UNIT.MONTH then #setMonth(#getMonth() + quantity)
when Date.UNIT.WEEK then #setDate(#getDate() + (7 * quantity))
when Date.UNIT.DAY then #setDate(#getDate() + quantity)
when Date.UNIT.HOUR then #setTime(#getTime() + (3600000 * quantity))
when Date.UNIT.MINUTE then #setTime(#getTime() + (60000 * quantity))
when Date.UNIT.SECOND then #setTime(#getTime() + (1000 * quantity))
else throw new Error "Unrecognized unit provided"
# # for chaining
Just another option, which I wrote:
DP_DateExtensions Library
It's overkill if this is all the date processing that you need, but it will do what you want.
Supports date/time formatting, date math (add/subtract date parts), date compare, date parsing, etc. It's liberally open sourced.
simply you can use this code with momnet library:
console.log(moment(moment()).add(30,"minutes").format('MM/DD/YYYY hh:mm:ss'));
var myDate= new Date();
var MyNewDate = new Date
(myDate.getFullYear(),myDate.getMonth(),myDate.getDate(),myDate.getMinutes()+10,01,01)
const MINUTE = 60 * 1000;
new Date(Date.parse(yourDate) + numOfMins * MINUTE)
I have a mySQL database in which I store the time in this format automatically:
2015-08-17 21:31:06
I am able to retrieve this time stamp from my database and bring it into javascript. I want to then get the current date time in javascript and determine how many days are between the current date time and the date time I pulled from the database.
I found this function when researching how to get the current date time in javascript:
Date();
But it seems to return the date in this format:
Tue Aug 18 2015 10:49:06 GMT-0700 (Pacific Daylight Time)
There has to be an easier way of doing this other than going character by character and picking it out from both?
You can build a new date in javascript by passing the data you receive from your backend as the first argument.
You have to make sure that the format is an accepted one. In your case we need to replace the space with a T. You may also be able to change the format from the back end.
Some good examples are available in the MDN docs.
var d = new Date("2015-08-17T21:31:06");
console.log(d.getMonth());
To calculate the difference in days you could do something like this:
var now = new Date();
var then = new Date("2015-08-15T21:31:06");
console.log((now - then)/1000/60/60/24);
You can select the difference directly in your query:
SELECT DATEDIFF(now(), myDateCol) FROM myTable;
the Date object has a function called getTime(), which will give you the current timestamp in milliseconds. You can then get the diff and convert to days by dividing by (1000 * 3600 * 24)
e.g.
var date1 = new Date()
var date2 = new Date()
var diffInMs = date2.getTime() - date1.getTime()
var diffInDays = diffInMs/(1000*3600*24)
Since none of the other answer got it quite right:
var pieces = "2015-08-17 21:31:06".split(' ');
var date = pieces[0].split('-');
var time = pieces[1].split(':');
var yr = date[0], mon = date[1], day = date[2];
var hour = time[0], min = time[1], sec = time[2];
var dateObj = new Date(yr, mon, day, hr, min, sec);
//if you want the fractional part, omit the call to Math.floor()
var diff = Math.floor((Date.now() - dateObj.getTime()) / (1000 * 60 * 60 * 24));
Note that none of this deals with the timezone difference between the browser and whatever you have stored in the DB. Here's an offset example:
var tzOff = new Date().getTimezoneOffset() * 60 * 1000; //in ms