基本的画布碰撞在 for 循环中不起作用

Question

我遇到了一个我无法弄清楚的碰撞问题。我的程序的重点是在 1920x900 的边界框中生成随机数量的圆（在 2 到 15 之间），速度随机。如果它们相互接触，它们应该会朝相反的方向飞去（我知道这不是伟大的物理学，但那会在以后出现。）

为此，我有四个数组：两个用于圆的坐标（xcords[] 和 ycords[]，两个用于每个圆的动量（xdirs[] 和 ydirs[]）。

这是我的碰撞函数

function collides(x, y)
    {
        if(Math.hypot(xcords[y]-xcords[x], ycords[y]-ycords[x]) < 50)
        {
            return true;
        }
        else return false;
    }

当我硬编码某些值时，例如

if(collides(xcords[1],xcords[0])
{
     xdirs[0] *= -1;
     xdirs[1] *= -1;
     ydirs[0] *= -1;
     ydirs[1] *= -1;
}

然后它工作正常。我硬编码的两个圆圈会正确碰撞。但是当我尝试将此应用于每个圈子时：

for(i=0; i<circles; i++)
        {
            for(j=0; j<circles; j++)
            {
                if(collides(xcords[i], xcords[j]))
                {
                    xdirs[i] *= -1;
                    xdirs[j] *= -1;
                    ydirs[i] *= -1;
                    ydirs[j] *= -1;
                }   
            }
        }

然后圈子就互相忽略了，我不知道为什么。这是我唯一一次在此代码中使用双 for 循环，但我多次执行第一个 for 循环，并且它为每个其他函数正确处理它。

这是一个 jsfiddle。 https://jsfiddle.net/sekbr0pg/ 边界框有点偏离，但足以看出碰撞是不稳定的。

Answer 1

让我们以圈 1 和圈 2 为例。您想检查它们是否发生碰撞只发生一次。下面的循环对此有好处吗？

for(i=0; i<circles; i++) {
        for(j=0; j<circles; j++){
        // if collides ...
        }
}

答案是否定的，原因是它们将运行两次，分别为i=1 and j=2 和i=2 and j=1。所以基本上它不会改变任何东西，因为 -1*-1 = 1。在你的循环中将 j=0 更改为 j=i+1。

你的collides 函数也接受圈子，所以我认为collides(i,j) 会完成这项工作。