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上崩潰

回答

相關問題