How to remove an object from an array inside a game loop (setInterval)

Question

I have a click event which checks if the object in the array should be removed(isSquashed) and when it's true we remove the object from the list of array but when that condition comes I either need to break out of the loop or decrement the i value, basically I want to come out of the for loop and call the gameloop again with the newArray list length after splicing the array object

I tried both ways

iterating the for loop backward

giving the break statement(getting illegal break Statement) but it's still not happening for me so could someone help me out with this and let me know how I could possibly fix this,

maingameloop = function(antsArray) {

  //inititialization

  // antsArray[i].draw();
  // antsArray[i].checkifSmashed();

  //gameloop
  if (this.isplaying) {
    console.log(this.score);
    for (let i = 0; i < antsArray.length; i++) {
      let gameloop = setInterval(() => {
          antsArray[i].move();
          antsArray[i].update(antsArray);

          if (antsArray[i].isSquashed) {
            this.score++;
            antsArray.splice(i, 1);
            // i--;
            clearInterval(gameloop);

            // this.isplaying = false ;
          }
        },
        this.FRAME_RATE,
      );
    }
  } else {
    //gameover
    // this.maingameloop(antsArray);
  }
}

the o/p I'm getting when I remove the object from the array is:

Uncaught TypeError: Cannot read property 'move' of undefined

nevermind i fxed it! just had to put the check condition outside of the setInterval oops — Sushant Shrestha, Oct 08 '19 at 05:26
_"nevermind i fxed it!"_ - Either add your solution as an answer and accept it or delete the question. — Andreas, Oct 08 '19 at 05:29
first time i asked a question in stack overflow so i didn't see the delete thread option mate — Sushant Shrestha, Oct 08 '19 at 08:10

mplungjan · Answer 1 · 2019-10-08T05:35:40.067

Never a good idea to loop intervals or timeouts

Try this

var cnt = antsArray.length

function ants() {
  if (cnt <= 0) {
    //gameover
    // this.maingameloop(antsArray);
    return;
  }
  if (this.isplaying) {
    console.log(this.score);
    antsArray[cnt].move();
    antsArray[cnt].update(antsArray); // ???
    if (antsArray[cnt].isSquashed) {
      this.score++;
      cnt--;
    }
    setTimeout(play, this.FRAME_RATE);
  }
}

score 0 · Answer 2 · answered Oct 08 '19 at 05:51

0

Avoid setInterval inside a loop because it would require an asynchronous callback to run inside a synchronous loop which will always show these kinds of errors.

answered Oct 08 '19 at 05:51

abbaszain

91
5

score 0 · Answer 3 · answered Oct 08 '19 at 07:08

i cleared the setInterval and then i checked for the conditions and added a break which wouldnt be illegal since im out of the interval and so it worked out for me thanks guys for your suggestions

maingameloop = function (antsArray) {

    //inititialization

    // antsArray[i].draw();
    // antsArray[i].checkifSmashed();

    //gameloop
    if (this.isplaying) {
      for (let i = 0; i< antsArray.length;  i++) {

      let gameloop = setInterval(() => {
        antsArray[i].move();
        antsArray[i].update(antsArray);

          if (antsArray[i].isSquashed) {
            this.score++;                             
            clearInterval(gameloop);           
          }

        }  
    , this.FRAME_RATE);

    if(antsArray[i].isSquashed ){
      antsArray.splice(i, 1);
     break;
    }  
    }
  }else {
      //gameover
      // this.maingameloop(antsArray);
    }
  }

How to remove an object from an array inside a game loop (setInterval)

3 Answers3