JavaScript中的蛇游戏:发生了2个错误

时间:2014-06-01 03:38:07

标签: javascript algorithm

我有2个错误感染了我的游戏。这是我到目前为止的链接:http://jaminweb.com/Snake.html。使用箭头键控制蛇的方向。

错误:

  • (1)当蛇的头撞到食物时,程序有时不会记录。我必须从不同的方向多次移过食物,直到它最终起作用;或者有时它永远不会奏效。
  • (2)当蛇击中食物时,它应该添加一个链接到它的结尾,但由于某种原因不起作用。

相关代码:

    $(document).keydown(function(e)
    {
        switch(e.which)
        {
            case 37: // left arrow key
              s.redirect(3);
              break;

            case 38: // up arrow key
              s.redirect(4);
              break;

            case 39: // right arrow key
               s.redirect(1)
               break;

            case 40: // down arrow key
               s.redirect(2);
               break;

            default: return; // exit this handler for other keys
        }
        e.preventDefault(); // prevent the default action (scroll / move caret)
     });    

    function snakegame(C, C_h, C_w)
    {
            /* NOTE TO SELF: C is a Raphel object. Can't find a method to return the height
               and width of a Raphael object in the documentation: 
               http://raphaeljs.com/reference.html#Raphael.
               Using C_h and C_w for now, but should probably change it later.
            */

            this.linkSize = 20; // size of a snake unit, in pixels

            this.food = C.rect(Math.floor(Math.random() * C_w / 4), Math.floor(Math.random() * C_h / 4), this.linkSize, this.linkSize);
            this.food.attr("fill","#39275b")

            /* On instantiation, the snake direction is down and has 1 link */
            this.dy = this.linkSize;
            this.dx = 0;
            this.link = C.rect(C_h/2, C_w/2, this.linkSize, this.linkSize);
            this.link.attr("fill", "#d7a900");
            this.body = [this.link];

            /* Event listener for changing the direction of the
               snake with arroy keys on the keyboard
            */
            this.redirect = function(dirnum)
            {
                switch (dirnum)
                {
                    /*
                        dirnum corresponds to
                        1 ---> right
                        2 ---> down
                        3 ---> left
                        4 ---> up
                    */
                    case 1: 
                        this.dx = this.linkSize;
                        this.dy = 0;
                        break;

                    case 2:
                        this.dx = 0;
                        this.dy = this.linkSize;
                        break;

                    case 3:
                        this.dx = -this.linkSize;
                        this.dy = 0;
                        break;

                    case 4:
                        this.dx = 0;
                        this.dy = -this.linkSize;
                        break;

                    default: // never happens
                        break;
                }

            }
            this.move = function()
            {
                /*
                    ..........
                */
                var temp = this.body[0];
                var BBhead = temp.getBBox();
                if (BBhead.x < 0 || BBhead.x2 > C_w || BBhead.y < 0 || BBhead.y2 > C_h)
                {
                    clearInterval(mover); 
                    alert("you hit the wall, idiot!");
                    return;
                }
                var BBfood = this.food.getBBox();
                if (this.boxCollision(BBhead, BBfood))
                {
                    var F = this.food;
                    this.moveFood(BBfood);
                    this.addLink();
                }
                this.body[0].translate(this.dx, this.dy);
                for (var i = 1, j = this.body.length; i < j; ++i)
                {
                    this.body[i] = temp;
                    temp = this.body[i];
                }
            }

            var mover = setInterval(this.move.bind(this), 100);   

            this.addLink = function()
            {
                var lastbb = this.body[this.body.length-1].getBBox();
                var newLink = C.rect(lastbb.x, lastbb.y, this.linkSize, this.linkSize);
                this.move;
                this.body.push(newLink);
                newLink.remove();
            }

            this.moveFood = function(bbf)
            {
                 var tx = Math.floor(Math.random() * C_w - bbf.x);
                 var ty = Math.floor(Math.random() * C_h - bbf.y);
                 for (var i = 0, j = this.body.length; i < j; ++i)
                 {
                    var thisbb = this.body[i].getBBox();
                    if (this.boxCollision(bbf,thisbb))
                        this(bff);
                 }
                 this.food.translate(tx, ty);
            }
            this.boxCollision = function(A, B)
            {
                return A.x >= B.x && A.x <= B.x2 && A.y >= B.y && A.y <= B.y2;
            }

    }

使用此http://raphaeljs.com/库创建图形元素。

我特别为(2)感到困扰。这是我添加链接到蛇的基本逻辑:

  var temp = this.body[0];
  /* ..... */
  this.body[0].translate(this.dx, this.dy); // move the head
  for (var i = 1, j = this.body.length; i < j; ++i)
  {
      this.body[i] = temp;
      temp = this.body[i];
  }

预期程序是:

  • 设置一个等于蛇头的临时变量。
  • 将蛇的头部向其指向的方向移动
  • 将元素移动到头部后面,将元素2称为头部的前一个位置。然后将元素3移动到元素2的先前位置。等等。

任何洞察问题的原因是什么????

0 个答案:

没有答案