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){

你可以在一段时间之后加上 ni ，就像这样：

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

并摆脱最后的ni = i + 1。你也可以这样做：

>             ob1 = collisions[i++];

并删除最后一个i++;，分配给 ob2 时， ni 也是如此。

执行上述操作会减少代码行数，使其更易于消化，例如

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?

            }
        }
    }
}

Javascript停止在画布中重复碰撞检测

1 个答案: