JS在Chrome上崩溃

我试图做一个使用画布作为任务的js游戏。我应该在画布上绘制蚂蚁，他们应该去寻找食物。我的代码可以扩展。出于某种原因，只有一个错误去食物，但真正的问题是，吃了两个食物后，当蚂蚁走第三时，js只是崩溃。计时器停止，我的按钮停止工作。我真的很困惑，不知道为什么它这样做。林调用requestAnimationFrame移动蚂蚁和我保持通话移动它们的功能是这样的：JS在Chrome上崩溃

function repeatOften() { 
    var cur_time = Date.now(); 
    var delta_time = (cur_time - last_frame)/1000; 
    var canvas = document.getElementById("canvas"); 
    var ctx = canvas.getContext("2d"); 
    ctx.clearRect(0, 0, canvas.width, canvas.height); 
    //ctx.fillRect(0, 0, canvas.width, canvas.height); 

    //update each bug 
    for (var i = 0; i < bugArray.length; i++) { 
    if (foodArray.length != 0) { 
     bugArray[i].cur_target = foodArray[0]; 
     var shortest_dist = Math.sqrt(((foodArray[0].xpos - bugArray[i].xpos) * (foodArray[0].xpos - bugArray[i].xpos)) + ((foodArray[0].ypos - bugArray[i].ypos) * (foodArray[0].ypos - bugArray[i].ypos))); 

     for (var a = 0; a < foodArray; a++) { 
     if (Math.sqrt(((foodArray[a].xpos - bugArray[i].xpos) * (foodArray[a].xpos - bugArray[i].xpos)) + ((foodArray[a].ypos - bugArray[i].ypos) * (foodArray[a].ypos - bugArray[i].ypos))) < shortest_dist) { 
      bugArray.cur_target = foodArray[a]; 
      shortest_dist = Math.sqrt(((foodArray[a].xpos - bugArray[i].xpos) * (foodArray[a].xpos - bugArray[i].xpos)) + ((foodArray[a].ypos - bugArray[i].ypos) * (foodArray[a].ypos - bugArray[i].ypos))); 
     } 
     } 

     // go towards the cur_target 
     if ((((bugArray[i].xpos - bugArray[i].cur_target.xpos) >= 0) && ((bugArray[i].xpos - bugArray[i].cur_target.xpos) < 10)) && (((bugArray[i].ypos - bugArray[i].cur_target.ypos) >= 0) && ((bugArray[i].ypos - bugArray[i].cur_target.ypos) < 10))) { 
     removeFood(bugArray[i].cur_target); 
     } 

     if ((bugArray[i].xpos - bugArray[i].cur_target.xpos) > 0) { 
     bugArray[i].xpos -= bugArray[i].speed * delta_time; 
     } else if ((bugArray[i].xpos - bugArray[i].cur_target.xpos) < 0) { 
     bugArray[i].xpos += bugArray[i].speed * delta_time; 
     } 

     if ((bugArray[i].ypos - bugArray[i].cur_target.ypos) > 0) { 
     bugArray[i].ypos -= bugArray[i].speed * delta_time; 
     } else if ((bugArray[i].ypos - bugArray[i].cur_target.ypos) < 0) { 
     bugArray[i].ypos += bugArray[i].speed * delta_time; 
     } 
    } 
    //draw foods 

    for (var i = 0; i < foodArray.length; i++) { 
     drawFood(foodArray[i]); 
    } 
    } 

    //update time 

    time -= delta_time; 
    last_frame = cur_time; 
    var timespan = document.getElementById("time"); 
    timespan.innerHTML = Math.round(time) + " seconds"; 
    if (Math.round(time) == 0 || foodArray.length == 0) { 
    DisplayScore(); 
    pause(); 
    } else { 
    drawBugArray(); 
    GlobalID = requestAnimationFrame(repeatOften); 
    if (Math.round(time) % ((Math.round(Math.random() * 300) + 1)) == 0) { 
     spawnBug(); 
    } 
    } 
}

我drawfood和drawbugarray功能只是在画布上绘制的食物和错误的模板，我的去除食物的功能是作为如下：

function removeFood(food) { 
    for (var i = 0; i < foodArray.length; i++) { 
    if (foodArray[i] == food) { 
     var temp = foodArray[i]; 
     foodArray[i] = foodArray[foodArray.length - 1]; 
     foodArray.pop(); 
     return temp; 
    } 
    } 
}

我真的很感谢任何帮助！预先感谢您:)

来源

2015-10-06 let_the_coding_begin

不应该是for （var a = 0; a

多数民众赞成在正确的感谢：D但没有导致问题 –

打开Javascript调试器，并在它即将崩溃时单击暂停按钮，以便您可以看到代码卡住的位置。 – Barmar

我修好了家伙！显然，绘制每个bug的所有食物是我在“for（var i = 0; i < bugArray.length; i ++）{}”循环之外的问题，并且它修复了它

来源

2015-10-06 22:13:49

JS在Chrome上崩溃

回答

相关问题