Question

我正在用html5画布制作游戏。我吸引了更多玩家。使用跳转功能时，我决定在设置的时间后使用一段时间将坐标还原为原始坐标。

错误是什么也没有发生，再次点击播放器，播放器将以其他方式前进，例如（down）;

class Character{
constructor(){
this.x = 50;
this.y = 400;
this.posX=0;
this.posY=0;
this.width;
this.height;
this.hitPoints=1;
this.directionFace="right";
this.jump = false;
this.jumpHeight = 23;
}

 move(e){

    this.x += this.posX;
    this.y += this.posY;

    if(e.keyCode == 37){
    console.log('left');
    this.posX -= 10;
    }

   else if (e.keyCode ==38){

       console.log("UP");

       if (!this.jumping) {

        this.posY -= this.jumpHeight;
        this.jumping = true;

        setTimeout(function(){
            this.posY = this.jumpHeight;          
            this.jumping = false;
        }, 500);
      }
    }

    else if (e.keyCode == 39){

        console.log("right");
         this.posX+=10;
        }

       e.preventDefault();
    }

我还有另一个类设置，该类使用setInterval在50ms处设置并等待键盘输入。

Answer 1

以下函数具有自己的this，它将不是您的Character类的实例。

setTimeout(function(){
            this.posY = this.jumpHeight;          
            this.jumping = false;
        }, 500);

尝试以下代码，fat-arrow函数没有自己的this上下文，并且将捕获并保留父上下文。

setTimeout(() => {
            this.posY = this.jumpHeight;          
            this.jumping = false;
        }, 500);

Answer 2

您要在move方法的开始处设置x和y。对posX和posY进行任何更改后，请尝试将它们移至末尾。另外，实施Ivan的更改。

您还需要在方法开始时重置posX和posY。否则，当按下任意键时，角色将继续向上或向侧面移动。

使用超时来执行跳转功能

2 个答案: