如何从游戏循环内的数组中删除 object (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

1. iterating the for loop backward

2. 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

Answer 1

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);
  }
}

Answer 2

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.

Answer 3

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);
    }
  }