Javascript停止在畫布中重複碰撞檢測

Question

我正在嘗試在javascript和html5畫布中執行一些簡單的碰撞。到目前爲止，我有這樣的：

checkCollision = (function(){ 
     var l, i, ni,dis = 0; 
     var ob1,ob2 = {}; 

     return function(){ 
      //collisions is the array holding all the objects 
      l = collisions.length; 
      i = 0; 
      ni = 1; 
      while(i<l){ 
       //grab the first object 
       ob1 = collisions[i]; 

       while(ni<l){ 
        //get the object to check against 
        ob2 = collisions[ni]; 
        //find the distance between the two 
        dis = Math.sqrt(Math.pow((ob1.pos[0]-ob2.pos[0]),2)+Math.pow((ob1.pos[1]-ob2.pos[1]),2)); 
        //rad is the radius 
        if(ob1.rad+ob2.rad >= dis){ 
         console.log("collision") 
        } 

        //move forward second increment 
        ni++; 
       } 

       i++; 
       //keep one place ahead 
       ni=i+1; 
      } 
     }; 

    })(); 

我這樣做是沒有任何形式的幫助，但現在我想我的大腦實在是太多了玉米粥推測這個最後一部分了。碰撞發生在每一幀，我不想要。當碰撞第一次發生時，我只想讓它發射一次。我試着給每個對象一個碰撞變量，如果已經發生了碰撞，但它不能很好地工作。有些它會發生一次，有些會不斷髮射。 有沒有人有任何指針？

Answer 1

你是什麼意思「發生每一幀」？算法似乎沒問題，但似乎沒有碰撞的任何內容，它只是被記錄下來。你想跳出循環嗎？

什麼都沒有做您的問題，但可能使你的代碼有點更具可讀性和簡潔的一些評論：

> checkCollision = (function(){ 
>   var l, i, ni,dis = 0; 
>   var ob1,ob2 = {}; 

我不知道你爲什麼初始化DIS和OB2，他們稍後分配值。使用這樣的閉包意味着這些值將持續到次級調用，直到分配新值。關閉是否真的需要？對於這樣的動畫可能會有性能提升。

>    ni = 1; 
>    while(i<l){ 

你可以把妮了一段時間後，類似這樣的：

 while(i < l){ 
      ni = i + 1; 

，擺脫過去的ni = i + 1的。你也可以這樣做：

>    ob1 = collisions[i++]; 

，擺脫過去的i++;的，一個分配給OB2時妮這樣做。

通過這樣做，減少了代碼行的數量，因此它更易消化，例如，

function checkCollision() { 
    var ni, dis, ob1, ob2; 
    //collisions is the array holding all the objects 
    var l = collisions.length; 
    var i = 0; 

    while (i < l) { 
     ni = i + 1; 
     //grab the first object 
     ob1 = collisions[i++]; 

     while (ni < l) { 
      //get the object to check against 
      ob2 = collisions[ni++]; 
      //find the distance between the two 
      dis = Math.sqrt(Math.pow((ob1.pos[0] - ob2.pos[0]), 2) + 
          Math.pow((ob1.pos[1] - ob2.pos[1]), 2)); 
      //rad is the radius 
      if (ob1.rad + ob2.rad >= dis) { 
       console.log("collision"); 

       // And what else? 

      } 
     } 
    } 
}