CODEWITHSUNDEEP
javascriptloopsdatefor-loop
RyanIs
RyanIs

Reputation: 37

Javascript Loop Next 10 Days

I have the following code which I want to return an incremental date for the next 10 days

const startingDay = new Date('2021-10-29');
const thisDay = new Date(startingDay);

for(var i=1; i<10; i++) {
    thisDay.setDate(startingDay.getDate() + i);
  console.log(thisDay);
}

which is great, but for some reason as soon as it hits Oct 31, it starts going up in months rather than days.

Why would that be?

Thanks

Upvotes: 1

Views: 454

Answers (4)

Terry Lennox
Terry Lennox

Reputation: 30705

Altering your logic slightly will give you the desired behaviour, setDate() will not work the way you expect with multiple calls to the same date instance.

The reason is that, starting with November 01, at iteration #4, we'll be setting the date to 33 (29 + 4). The logic used by setDate will be to advance the date to the next month, December, since November has only 30 days, then advancing another 2 days to December 3. The same effect will happen for subsequent iterations.

By re-creating the thisDay variable on each iteration, the logic used by setDate will work as expected.

const startingDay = new Date('2021-10-29');

for(var i= 1; i < 10; i++) {
    let thisDay = new Date(startingDay);
    thisDay.setDate(startingDay.getDate() + i);
    console.log(thisDay);
}
.as-console-wrapper { max-height: 100% !important; top: 0; }

Upvotes: 2

Shilly
Shilly

Reputation: 8589

Read the docs for https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/setDate .

It will automatically switch to the next or previous month if you provide a value that is out of range for the current month. This makes it easier to jump between months when adding days.

But the way you've coded your example, you always start from the day of the original date, but edit the second date:

i:1 | date = 2021-10-29 -> set day to 30th -> date = 2021-10-30

i:2 | date = 2021-10-30 -> set day to 31st -> date = 2021-10-31

i:3 | date = 2021-10-31 -> set day to 32nd -> date = 2021-11-01, since oct only has 31 days

i:4 | date = 2021-11-01 -> set day to 33rd -> date = 2021-12-03, since nov has 30 days, so adding 33 days to the first of nov, gives us 3rd of december

Upvotes: 1

0stone0
0stone0

Reputation: 44063

for(var i=1; i<10; i++) {
    thisDay.setDate(startingDay.getDate() + i);

Since you're looping from 1 to i < 10, you'll add more days as the loop progresses.

I want to return an incremental date for the next 10 days

So why update thisDay with the startingDay.getDate() + i if you can just use thisDay.getDate() + 1:

const startingDay = new Date('2021-10-29');
const thisDay = new Date(startingDay);

for(var i=1; i<10; i++) {
    thisDay.setDate(thisDay.getDate() + 1);
    console.log(thisDay);
}

"2021-10-30T00:00:00.000Z"
"2021-10-31T00:00:00.000Z"
"2021-11-01T01:00:00.000Z"
"2021-11-02T01:00:00.000Z"
"2021-11-03T01:00:00.000Z"
"2021-11-04T01:00:00.000Z"
"2021-11-05T01:00:00.000Z"
"2021-11-06T01:00:00.000Z"
"2021-11-07T01:00:00.000Z"

Upvotes: 2

Ran Turner
Ran Turner

Reputation: 18076

To avoid the incorrect day due to month switching you can solve it using Date() itself. 

const startingDay = new Date('2021-10-29');
let thisDay = new Date(startingDay);

for(let i = 1; i<10; i++) {
      thisDay = new Date(Date.now() + i * 24 * 60 * 60 * 1000);
      console.log(thisDay.getDate());
}

Upvotes: 0

Related Questions