Javascript (Typescript): for loop not working properly

Question

I am working in Ionic 2 and I'm trying to make a for loop to show certain data. But it is acting very strange.

I currently have an array of "time left" using moment.js

var dur = moment.duration( moment(date).diff(moment()) );
let yearsRemain = dur.years();
let monthsRemain = dur.months();
let daysRemain = dur.days();
let hoursRemain = dur.hours();
let minutesRemain = dur.minutes();
let secondsRemain = dur.seconds();

var dateArray = [
  yearsRemain,
  monthsRemain,
  daysRemain,
  hoursRemain,
  minutesRemain,
  secondsRemain
]

If I were to output the dateArray like this.timeString = dateArray.join(","); and show timeString in my html, I can see the following values:

0,  0,  0,-17,-46, -3  //17 hours ago
0,  0,  0, 10,  7, 47  //in 10 hours 7 minutes
0,  0,  2,  1,  9, 35  //in 2 days and 1 hour

Now, I iterate through the array and I try to get the two largest values. I'm trying to show a string like I have in the comments above. If it is in the past, I want to show just the largest value.

for(var i = 0; i < dateArray.length; i++) {
  if(dateArray[i] > 0){
    //If the event is in the future
    this.state = "future";
    this.timePrimary = dateArray[i];
    this.timePrimaryType = this.typeOfTime(i, dateArray[i]);
    this.timeSecondary = dateArray[i+1] !== 0 ? dateArray[i+1] : dateArray[i+2];
    this.timeSecondaryType = dateArray[i+1] !== 0 ? this.typeOfTime(i+1, dateArray[i+1]) : this.typeOfTime(i+2, dateArray[i+2]);
    break;
  } else if(dateArray[i] < 0) {
    //If the event is in the past
    this.state = "past";
    this.timePrimary = dateArray[i] * (-1);
    this.timePrimaryType = this.typeOfTime(i, (dateArray[i] * (-1))) + " ago";
    break;
  } else {
    i++
  }
}

This loop goes through each array item and should catch the first array item that isn't a 0. If it's larger than 0, the event is in the future and I want to capture that number and the next (if the next is zero, find the next, I'm going to upgrade this part soon).

Here's the problem

For some reason, it's skipping the hours part of the array when hours is the largest number. Take the second example from above: 0, 0, 0, 10, 7, 47. All I see is 7 minutes and 47 seconds when it should read 10 hours and 7 minutes.

Any ideas as to why this is happening?

Just in case you feel like asking, here's the typeOfType function:

typeOfTime(type, num) {
var display;
var plur = num === 1 ? "" : "s";
switch(type) {
  case 0:
    display = "Year" + plur;
    break;
  case 1:
    display = "Month" + plur;
    break;
  case 2:
    display = "Day" + plur;
    break;
  case 3:
    display = "Hour" + plur;
    break;
  case 4:
    display = "Minute" + plur;
    break;
  case 5:
    display = "Second" + plur;
    break;
}
return display;

}

@torazaburo The else statement is basically saying if the value of this array item is equal to 0, look at the next array item — ntgCleaner
– ntgCleaner, Commented Feb 14, 2017 at 16:02
@torazaburo, your comment was dead on. I had the biggest brain fart ever. No reason to increment a loop inside a for loop... Thank you! — ntgCleaner
– ntgCleaner, Commented Feb 14, 2017 at 16:06
Maybe momentjs.com/docs/#/displaying/fromnow or momentjs.com/docs/#/displaying/from and similar? — DrColossos
– DrColossos, Commented Feb 14, 2017 at 16:08
@DrColossos, I tried using that, and it works great, but I wanted to see the largest 2 times. from and from now only show the single largest time. — ntgCleaner
– ntgCleaner, Commented Feb 14, 2017 at 16:09

Amr Eladawy · Accepted Answer · 2017-02-14 17:01:17Z

1

This is because of the else statement in your code is incrementing the counter i and that is causing the loop to skip the next item in the array when it hits a 0. That is why 10 is skipped after 0. Remove that part and it should work.

for(var i = 0; i < dateArray.length; i++) {
  if(dateArray[i] > 0){
    //If the event is in the future
    this.state = "future";
    this.timePrimary = dateArray[i];
    this.timePrimaryType = this.typeOfTime(i, dateArray[i]);
    this.timeSecondary = dateArray[i+1] !== 0 ? dateArray[i+1] : dateArray[i+2];
    this.timeSecondaryType = dateArray[i+1] !== 0 ? this.typeOfTime(i+1, dateArray[i+1]) : this.typeOfTime(i+2, dateArray[i+2]);
    break;
  } else if(dateArray[i] < 0) {
    //If the event is in the past
    this.state = "past";
    this.timePrimary = dateArray[i] * (-1);
    this.timePrimaryType = this.typeOfTime(i, (dateArray[i] * (-1))) + " ago";
    break;
  } else {
    //do nothing... let the loop to go on.
  }
}

edited Feb 14, 2017 at 17:01

answered Feb 14, 2017 at 16:04

Amr Eladawy

4,3797 gold badges36 silver badges52 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

ntgCleaner Over a year ago

Wow. that's a facepalm right there... Thank you for helping me understand a basic loop again! Answer will be accepted in 7 minutes

Collectives™ on Stack Overflow

Javascript (Typescript): for loop not working properly

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related