js game freezes with no error

Question

I am working on a javascript game that involves building, destroying, and survival. It has been working fine but after adding trees the game would randomly freeze after breaking blocks. The code is here:

for (var bl in blocks) {
           if (mouse.x >= blocks[bl].x-camera.x && mouse.y >= camera.y+blocks[bl].y && mouse.x <= blocks[bl].x-camera.x+64 && mouse.y <= camera.y+blocks[bl].y+64) {
                document.body.style.cursor = "pointer";
                if (mouse.down) {
                     if (!blocks[bl].d && blocks[bl].d !== 0) {
                          blocks[bl].d = 32;
                     } else if (blocks[bl].d > 0) {
                          blocks[bl].d -= 0.5;
                          if (tools[player.tool].n === 'axe') {
                               blocks[bl].d -= 1;
                          }
                     } else {
                          var fb = false;
                          for (var i in inventory) {
                               if (inventory[i].n === blocks[bl].n) {
                                    inventory[i].a ++;
                                    fb = true;
                               }
                          }
                          if (!fb) {
                               inventory.push({n: blocks[bl].n, a: 1});
                          }
                          blocks.splice(bl, 1);
                     }
                }
           }
      }

I don't see any way there could be an infinite loop and no errors show up when it happens.

EDIT

I changed the code to

          var spliceblock = {bl: 0, s: false};
          for (var bl in blocks) {
               if (mouse.x >= blocks[bl].x-camera.x && mouse.y >= camera.y+blocks[bl].y && mouse.x <= blocks[bl].x-camera.x+64 && mouse.y <= camera.y+blocks[bl].y+64) {
                    document.body.style.cursor = "pointer";
                    if (mouse.down) {
                         if (!blocks[bl].d && blocks[bl].d !== 0) {
                              blocks[bl].d = 32;
                         } else if (blocks[bl].d > 0) {
                              blocks[bl].d -= 0.5;
                              if (tools[player.tool].n === 'axe') {
                                   blocks[bl].d -= 1;
                              }
                         } else {
                              var fb = false;
                              for (var i in inventory) {
                                   if (inventory[i].n === blocks[bl].n) {
                                        inventory[i].a ++;
                                        fb = true;
                                   }
                              }
                              if (!fb) {
                                   inventory.push({n: blocks[bl].n, a: 1});
                              }
                              spliceblock.s = true;
                              spliceblock.bl = bl;
                              //blocks.splice(bl, 1);
                         }
                    }
               }
          }
          if (spliceblock.s) {
               blocks.splice(spliceblock.bl, 1);
          }

but it still freezes randomly when trying to break blocks.

Answer 1

Modifying an array (using splice) while you're iterating through it is bound to cause problems. If you remove the block bl from the array and then continue to run through it, the counter will probably be off.

Instead, store the index of the block you're removing, then remove it after you're done looping through the blocks.