如何制作子弹动画？ （射击游戏）

Question

我正在尝试制作射击游戏，但我遇到了一些子弹动画的麻烦。每次单击时，都会创建一个新的项目符号对象并开始动画，但每次单击后，创建的项目符号都会消失，同一个项目符号会重新开始，这比之前的项目符号要快。所以我想在每次点击后创建新子弹。一个基本的射击游戏逻辑。这是我的代码：

    function newBullet(x,y,angle,speed,id,type) {
    this.x = x;
    this.y = y;
    this.speed = speed;
    this.angle = angle;
    this.radians = this.angle * Math.PI / 180;
    this.id = id;
    this.type = type;
    this.drawBullet = drawBullet;
    this.moveBullet = moveBullet;
    }

    function moveBullet() {
    this.x = this.x + Math.cos(this.radians) * this.speed ;
    this.y = this.y + Math.sin(this.radians) * this.speed;
    ctx.drawImage( bulletImg, this.x, this.y);
    }

    function drawBullet() {
        bullet = new newBullet(playerX,playerY,getAngle(),2,1,1);
        bullets[bullets.length] = bullet;
        setInterval("bullets[bullets.length - 1].moveBullet()", 25);
    }

canvas.addEventListener("mousedown",drawBullet,false);  

Answer 1

尝试在此处添加var：

    var bullet = new newBullet(playerX,playerY,getAngle(),2,1,1);

Answer 2

如果要将子弹添加到数组，则应使用push。这将更新bullets.length：

function drawBullet() {
        var bullet = new newBullet(playerX,playerY,getAngle(),2,1,1);
        bullets.push(bullet);
        setInterval(bullets[bullets.length - 1].moveBullet, 25);
}

您创建的子弹消失的原因：您每次都替换bullets[0]。新子弹比旧子弹更快，因为bullets[0].moveBullet在每25ms间隔中被称为n次，其中n是你“创建”的子弹数量。