Develop Reference

How to convert date from react calendar in the dd/mm/yyyy format?

I am using react-calendar , Here I am getting a date in the following format
Wed Feb 02 2022 00:00:00 GMT+0530 (India Standard Time)
Now I am trying to convert it to dd/mm/yyyy. is there any way though which I can do this ?
Thanks.

The native Date object comes with seven formatting methods. Each of these seven methods give you a specific value -
toString() : Fri Jul 02 2021 14:03:54 GMT+0100 (British Summer Time)
toDateString(): Fri Jul 02 2021
toLocaleString() : 7/2/2021, 2:05:07 PM
toLocaleDateString() : 7/2/2021
toGMTString() : Fri, 02 Jul 2021 13:06:02 GMT
toUTCString() : Fri, 02 Jul 2021 13:06:28 GMT
toISOString() : 2021-07-02T13:06:53.422Z
var date = new Date();
// toString()
console.log(date.toString());
// toDateString()
console.log(date.toDateString());
// toLocalString()
console.log(date.toLocaleString());
// toLocalDateString()
console.log(date.toLocaleDateString());
// toGMTString()
console.log(date.toGMTString());
// toGMTString()
console.log(date.toUTCString());
// toGMTString()
console.log(date.toISOString());
Format Indian Standard time to Local time -
const IndianDate = 'Wed Feb 02 2022 00:00:00 GMT+0530 (India Standard Time)';
const localDate = new Date(IndianDate).toLocaleDateString();
console.log(localDate);

You could use the methods shown in this blogpost https://bobbyhadz.com/blog/javascript-format-date-dd-mm-yyyy from Borislav Hadzhiev.
You could a new date based on your calendar date and afterwards format it:
function padTo2Digits(num) {
return num.toString().padStart(2, '0');
}
function formatDate(date) {
return [
padTo2Digits(date.getDate()),
padTo2Digits(date.getMonth() + 1),
date.getFullYear(),
].join('/');
}
console.log(formatDate(new Date('Wed Feb 02 2022 00:00:00 GMT+0530 (India Standard Time)')));

This is JavaScript default date format.
You can use libraries like momentjs, datefns, etc to get the result.
For example, if you are using momentjs:-
moment(date).format('dd/mm/yyyy);
Or if you don't want to use any third-party library you can get the result from JavaScript's default date object methods.
const date = new Date();
const day = date.getDate() < 10 ? 0${date.getDate()} : date.getDate();
const month = date.getMonth() + 1 < 10 ? 0${date.getMonth() + 1} : date.getDate() + 1;
const year = date.getFullYear();
const formattedDate = ${day}/${month}/${year};

javascript - date difference should be zero but it is 18 hours

This one has stumped me. It should be so simple I would think. I am doing some very simple date subtraction in Javascript. I am subtracting the same dates and I would think it would give zero hours, but it gives 18 hours.
let inDate = new Date('Tue Aug 27 2019 00:00:00 GMT-0500 (Central Daylight Time)').getTime();
let outDate = new Date('Tue Aug 27 2019 00:00:00 GMT-0500 (Central Daylight Time)').getTime();
document.getElementById('date').innerHTML = new Date(outDate - inDate);
<div id='date'>
</div>
In case it produces different results based on where you are, the result I am getting is this:
Wed Dec 31 1969 18:00:00 GMT-0600 (Central Standard Time)

This is due to your timezone. If you convert to GMT String before print it the time will be correct. (Jan 01, 1969 00:00:00)
new Date(outDate - inDate).toGMTString()
You should see the correct date.
let inDate = new Date('Tue Aug 27 2019 00:00:00 GMT-0500 (Central Daylight Time)').getTime()
let outDate = new Date('Tue Aug 27 2019 00:00:00 GMT-0500 (Central Daylight Time)').getTime()
console.log(new Date(inDate - outDate).toGMTString())

Getting first and last day of three consecutive month in javascript

I want to get the first date and last date of three consecutive month starting from current moth and moving towards past,i.e. if current month is November,my output will be first and last of Nov,followed by first and last date of October,followed by first and last date of September. I have written the code as follows:
<script type="text/javascript">
function calculatingMonthRange(){
console.log('calculatingMonthRange() got called');
var date = new Date();
var currdate=date;
for(i=1;i<=3;i++){
var firstDay = new Date(date.getFullYear(), date.getMonth(), 1);
var lastDay = new Date(date.getFullYear(), date.getMonth() + 1, 0);
console.log('FirstDay='+firstDay+' LastDay='+lastDay+"\n");
date.setDate(currdate.getDate()-(30*i));
}
}
</script>
this is the output what I'm getting:::
FirstDay=Fri Nov 01 2013 00:00:00 GMT+0530 (India Standard Time) LastDay=Sat Nov 30 2013 00:00:00 GMT+0530 (India Standard Time)
FirstDay=Tue Oct 01 2013 00:00:00 GMT+0530 (India Standard Time) LastDay=Thu Oct 31 2013 00:00:00 GMT+0530 (India Standard Time)
FirstDay=Thu Aug 01 2013 00:00:00 GMT+0530 (India Standard Time) LastDay=Sat Aug 31 2013 00:00:00 GMT+0530 (India Standard Time)
where is the month September is going????why is it printing August instead of September?????

This works:
function calculatingMonthRange(){
console.log('calculatingMonthRange() got called');
var date = new Date();
var currdate=date;
for(i=1;i<=3;i++){
var firstDay = new Date(date.getFullYear(), date.getMonth(), 1);
var lastDay = new Date(date.getFullYear(), date.getMonth() + 1, 0);
console.log('FirstDay='+firstDay+' LastDay='+lastDay+"\n");
date = new Date(date.getFullYear(), date.getMonth() - 1, 1);
}
}
You can play with the code here: http://jsbin.com/uPaVOXI/1/edit?js,console

31 days in February in Date object

This code should log all days for given month:
var date = new Date(2012,2,1);
var thisMonth = date.getMonth();
while(date.getMonth()==thisMonth) { // 31 steps ???
console.log(date.getMonth(),date.getDate());
date.setDate(date.getDate()+1);
}
It works well for every month but February. Any ideas where is the catch?

Note the month parameter is 0-indexed, so your code is about March not February.
The doc:
month
Integer value representing the month, beginning with 0 for January to
11 for December.

Use new Date(2012,1,1); month is zero-based ;-)

This is pretty interesting:
new Date('2014-02-28'); // Fri Feb 28 2014 01:00:00 GMT+0100
new Date('2014-02-29'); // Sat Mar 01 2014 01:00:00 GMT+0100
new Date('2014-02-30'); // Sun Mar 02 2014 01:00:00 GMT+0100
new Date('2014-02-31'); // Mon Mar 03 2014 01:00:00 GMT+0100
new Date('2014-02-32'); // Invalid Date

javascript Date library repeating October

While trying to find out why I was having issues while working on a calendar, I ran into this issue. When setting the month to 8, the date is set to October, when the month is set to 9, the date is set to October.
Code to test
var d = new Date();
document.write(d.getMonth());
d.setMonth(8);
document.write(d.getMonth());
d.setMonth(9);
document.write(d.getMonth());
output:
799
The current date is August 31st 2012, the month number should be 7, since the javascript months are 0 based.
Can someone explain this? I have been able to reproduce it on more than one computer.

September only has 30 days - when you set the day to 31 (or create a date on the 31st of some month) and then change the month to one with fewer than 31 days JavaScript rolls the date over into the next month (in this case October). In other words, the date overflows.
> var d = new Date()
> d
Fri Aug 31 2012 22:53:50 GMT-0400 (EDT)
// Set the month to September, leaving the day set to the 31st
> d.setMonth(8)
> d
Mon Oct 01 2012 22:53:50 GMT-0400 (EDT)
// Doing the same thing, changing the day first
> var d = new Date()
> d
Fri Aug 31 2012 22:53:50 GMT-0400 (EDT)
> d.setDate(30)
> d
Thu Aug 30 2012 22:53:50 GMT-0400 (EDT)
> d.setMonth(8)
Sun Sep 30 2012 22:53:50 GMT-0400 (EDT)
So the simple answer is, because the date for today is the 31st of August and the 31st of September is October 1st.