Javascript 游戏没有迭代，不知道为什么

我正在尝试用纯javascript制作一个浏览器游戏。起初我是用codesandbox.io来写的，但最后我决定今天我已经写完了，需要检查一下它是否在浏览器中工作。你瞧，它没有。我真的不知道为什么它不起作用

所有的代码应该做的，就是做一个正方形的跳跃。它确实做到了这一点，但是当你松开up键时，页面会挂起，甚至不会刷新。但不会使浏览器崩溃。不管怎样，这是我的密码

class player {
  constructor(gameW, gameH) {
    this.gameH = gameH;

    this.width = 50;
    this.heigth = 50;

    this.maxUpV = 5;
    this.currV = 0;
    this.gravConst = 50;

    this.position = {
      x: 50,
      y: 150
    };
  }

  jumpUp() {
    this.currV = -this.maxUpV;
  }
  fall(falling) {
    while (this.position.y < 150) {
      this.currV = this.maxUpV;
    }
    return (falling = false);
  }

  draw(ctx) {
    ctx.fillStyle = "#F00";
    ctx.fillRect(this.position.x, this.position.y, this.width, this.heigth);
  }

  update(deltaTime) {
    if (!deltaTime) {
      return;
    }

    this.position.y += this.currV;

    if (this.position.y + this.heigth > 200) {
      this.position.y = 150;
    }
  }
}

class input {
  constructor(Player) {
    this.falling = false;

    document.addEventListener("keydown", event => {
      if (event.keyCode === 38) {
        if (!Player.fall(this.falling)) {
          Player.jumpUp();
        }
      }
    });

    document.addEventListener("keyup", event => {
      if (event.keyCode === 38) {
        this.falling = true;
        Player.fall(this.falling);
      }
    });
  }
}



const GAME_WIDTH = 800;
const GAME_HEIGHT = 300;

var canvas = document.getElementById("gameScreen");
var ctx = canvas.getContext("2d");

var Player = new player(GAME_WIDTH, GAME_HEIGHT);

ctx.clearRect(0, 0, 800, 300);

ctx.fillRect(0, 200, 800, 200);
ctx.fillRect(400, 100, 50, 1);

Player.draw(ctx);

new input(Player);

var lastTime = 0;

function gameLoop(timeStamp) {
  var deltaTime = timeStamp - lastTime;

  lastTime = timeStamp;

  ctx.clearRect(0, 0, 800, 200);

  Player.update(deltaTime);
  Player.draw(ctx);

  requestAnimationFrame(gameLoop);
}

gameLoop();

职业选手{
构造函数（gameW，gameH）{
this.gameH=gameH；
这个宽度=50；
这个高度=50；
这是maxUpV=5；
该值为0.currV=0；
这个.gravConst=50；
此位置={
x:50，
y:150
};
}
跳起{
this.currV=-this.maxUpV；
}
坠落（坠落）{
而（该位置y<150）{
this.currV=this.maxUpV；
}
返回（下降=错误）；
}
抽签（ctx）{
ctx.fillStyle=“#F00”；
ctx.fillRect（this.position.x，this.position.y，this.width，this.heigth）；
}
更新（deltaTime）{
if（！deltaTime）{
返回；
}
this.position.y+=this.currV；
如果（此位置y+此高度>200）{
此.position.y=150；
}
}
}
类输入{
构造器（玩家）{
这是错误的；
document.addEventListener（“keydown”，事件=>{
如果（event.keyCode===38）{
如果（！Player.fall（this.falling））{
Player.jumpUp（）；
}
}
});
document.addEventListener（“keyup”，事件=>{
如果（event.keyCode===38）{
这是真的；
玩家摔倒（这个摔倒）；
}
});
}
}
const GAME_WIDTH=800；
const GAME_高度=300；
var canvas=document.getElementById（“游戏屏幕”）；
var ctx=canvas.getContext（“2d”）；
var Player=新玩家（游戏宽度、游戏高度）；
ctx.clearRect（0,0,800,300）；
ctx.fillRect（00200800200）；
ctx.fillRect（400,100,50,1）；
牌手抽签（ctx）；
新输入（播放器）；
var lastTime=0；
函数gameLoop（时间戳）{
var deltaTime=时间戳-最后时间；
lastTime=时间戳；
ctx.clearRect（0,0800200）；
Player.update（deltaTime）；
牌手抽签（ctx）；
requestAnimationFrame（gameLoop）；
}
gameLoop（）；

---

还有，当我在codesandbox.io中编写它时，这些类是我导入到main.js文件中的独立文件。这给了我一个浏览器错误，所以我把所有的东西都放在一个文件里。我试过Vivaldi和Firefox，但都没用。

我最初误解了这个问题。您的代码锁定在您的fall函数中。一旦你达到最大高度，你就会陷入一个等待坠落的循环中，但永远不会回到任何可能导致坠落的地方。我很难理解你的最大身高验证

fall函数将始终返回false

 fall(falling) {
   while (this.position.y < 150) {
     this.currV = this.maxUpV;
   }
   return (falling = false);
 }

条件语句基本上总是返回true，并且可以简化

我希望这有帮助

职业玩家{
构造函数（gameW，gameH）{
this.gameH=gameH；
这个宽度=50；
这个高度=50；
这是maxUpV=5；
该值为0.currV=0；
这个.gravConst=50；
此位置={
x:50，
y:150
};
}
跳起{
this.currV=-this.maxUpV；
}
坠落（坠落）{
如果（此位置y 200）{
此.position.y=150；
}
}
}
类输入{
构造器（玩家）{
这是错误的；
document.addEventListener（“keydown”，事件=>{
如果（event.keyCode===38）{
如果（！这个，掉下去）{
Player.jumpUp（）；
}
}
});
document.addEventListener（“keyup”，事件=>{
如果（event.keyCode===38）{
这是真的；
this.fall=Player.fall（）；
}
});
}
}
const GAME_WIDTH=800；
const GAME_高度=300；
var canvas=document.getElementById（“游戏屏幕”）；
var ctx=canvas.getContext（“2d”）；
var Player=新玩家（游戏宽度、游戏高度）；
ctx.clearRect（0,0,800,300）；
ctx.fillRect（00200800200）；
ctx.fillRect（400,100,50,1）；
牌手抽签（ctx）；
新输入（播放器）；
var lastTime=0；
函数gameLoop（时间戳）{
var deltaTime=时间戳-最后时间；
lastTime=时间戳；
ctx.clearRect（0,0800200）；
Player.update（deltaTime）；
牌手抽签（ctx）；
requestAnimationFrame（gameLoop）；
}
gameLoop（）
你的项目旁注：我发现在编写自己的引擎时非常有用。这种方法很有效，只是现在跳转之间有一个巨大的延迟，比我希望的要大。我该如何着手解决这个问题？编辑：没关系，没有延迟，只是第二次需要两次击键才能跳转。@YourRentIsDue是的，跳转非常奇怪，我还注意到（感谢我的笔记本电脑的粉丝们）你的游戏循环非常有攻击性，我认为这导致了输入的缓慢。我也很擅长做一件事。请随意参考我的项目，看看其他方法来设计你的游戏。
if (!Player.fall(this.falling)) {
  Player.jumpUp();
}