Logic in space-invaders type game

I'm in the process of teaching myself JS and there's some learning curves with different aspects, I guess. I was able to make a pretty simple game yesterday and am trying to do a space-invaders like game with similar logic, but the enemies won't move, or worse, it crashes and shows nothing in the console. I'd really appreciate some guidance as how to ameliorate my code and what is causing this not to function. Thanks so much -- really appreciative of any help for this

let player;  let bullets = [];  let enemies = [];    let intObject;    let canvas = document.getElementById("drawingCanvas");  let brush = canvas.getContext("2d");  let myKeys = {           left: false,      right: false,      f: false  };       let bodyElem = document.getElementById("body");   bodyElem.addEventListener("keydown", function(event){       //f key = fire       if(event.key === "Fdown"){           myKeys.f = true;       }          if(event.key === "ArrowRight"){           myKeys.right = true;       }          if(event.key === "ArrowLeft"){           myKeys.left = true;       }   }   );    function GetRandomInteger(a, b){      // collects random integer between 2 numbers, switch if b>a      if (a > b){          small = b;          large = a;      }      else{          small = a;          large = b;      }            let x = parseInt(Math.random() * (large - small + 1)) + small;      return x;  }    function RandomColor(min = 0, max = 255){      let r = GetRandomInteger(min, max);      let g = GetRandomInteger(min, max);      let b = GetRandomInteger(min, max);      return "rgba(" + r + ", " + g + ", " + b + ", 1.0)";  }    class Rectangle{      constructor(x,y,dX,dY,width,height, color){          this.x = x;          this.y = y;          this.dX = dX;          this.dY = dY;          this.width = width;          this.height = height;          this.color = color;      }        MoveRight(){          let newX = this.x + this.dX;          if(newX + (this.width - 1) < can.width){              this.x = newX;          }      }        MoveLeft(){          let newX = this.x - this.dX;          if(newX >= 0){              this.x = newX;          }      }        MoveBullet(){          // bullets move up, no restriction          this.dY-=this.height;      }        MoveEnemy(){          // enemies only,move downward without restriction         while(this.dY<canvas.height){this.height+=this.dY;      }      }        Fire(){          //bullet comes out of middle of player's x axis and goes upward perpetually til offscreen                    let bulletcolor = GetRandomColor();          let bullet = new Rectangle(player.x,player.y,5,10,20,20,bulletcolor);          for(i=0; i<bullets.length;i++){          if(myKeys.f ===true){              this.MoveBullet();              myKeys.f=false;              bullets.push(bullet);}              }             }        Draw(){          brush.beginPath();          brush.lineTo(this.x, this.y);          brush.lineTo(this.x + this.width - 1, this.y);          brush.lineTo(this.x + this.width - 1, this.y + this.height - 1);          brush.lineTo(this.x, this.y + this.height - 1);          brush.lineTo(this.x, this.y);          brush.closePath();            brush.strokeStyle = this.color;          brush.stroke();      }  }       function CreatePlayer(){     //create player roughly midscreen at base of canvas       let halfX= canvas.width/2;       let playerStartY=canvas.height-60;       player = new Rectangle(halfX,playerStartY,halfX,playerStartY,50,50,"red");      player.Draw();  }        function CreateEnemy(){     //Create enemy at a random point near top of screen by pushing into array      let color = RandomColor();      let randomX = GetRandomInteger(0,canvas.width);           for(let i = 0 ; i <= enemies.length; i++){          let enemy = new Rectangle(randomX,60,1,10,50,50,color);                     enemies.push(enemy);                    // enemy.MoveEnemy();      }         }         function DrawAndMoveAllBullets(){     //draws the bullets and enacts them to go upscreen      for(i=0;i<=bullets.length;i++){          if(bullets[i]!=undefined){                           bullets[i].Draw();              bullets[i].Fire();          }      }  }    function DrawAndMoveAllEnemies(){            for(i=0;i<=enemies.length;i++){          if(enemies[i]!=undefined){              enemies[i].Draw();                       enemies[i].MoveEnemy();                        }      }  }    function RemoveOffScreenBullets(){            for(i=bullets.length;i>0;i--){          if(bullets[i]!=undefined &&bullets[i].y>0){              bullets.pop(bullets[i]);          }      }  }      function Collides(rect1, rect2){     rect1 = new Rectangle(x,y,width,height);   rect2 = new Rectangle(x,y,width,height);         if(rect1.x>rect2.width|| rect1.y>rect2.height||rect1.height<rect2.y||rect1.width<rect2.x){        console.log(false);               return(false);     }     else{         return true;     }      }       function CheckBulletHit(){        let enemObj=enemies[i];      let bullObj= bullets[i];      if(bullObj!=undefined && enemies[i]!=undefined){          for(i=0;i<bullets.length;i++){              for (j=0;j<=enemies.length; j++){                  if (Collides(enemObj.x,enemObj.y,bullObj.x,bullObj.y)){                      enemies.pop(enemObj);                      bullets.pop(bullObj);                      return true;                  }                  return false;              }          }      }  }    function CheckGameEnd(){                          for(i=0;i<enemies.length;i++){       if (enemies[i].dY = canvas.height){           EndGame();         }    }  }    function DrawGameScreen(){      brush.clearRect(0,0,canvas.width, canvas.height);        if(enemies.length < 5){          // add new enemy if <5          CreateEnemy();      }            // draw the player object      player.Draw();        // move player right or left      if(myKeys.left){          player.MoveLeft();      }      if(myKeys.right){          player.MoveRight();      }      // fire a bullet when f key is pressed      if(myKeys.f){          player.Fire();      }        // reset all key presses false      myKeys.left = false;      myKeys.right = false;      myKeys.f = false;           DrawAndMoveAllEnemies();            DrawAndMoveAllBullets();        CheckBulletHit();        RemoveOffScreenBullets();          CheckGameEnd();  }    function StartGame(){      // calls setInterval gamescreen      CreatePlayer();      intObject = setInterval(DrawGameScreen, 500);  }    function EndGame(){      clearInterval(intObject);  }  

I'm really at a loss but just trying to improve my concepts of logic and understanding, so it's a big help if any input. Thanks everyone

https://stackoverflow.com/questions/67014139/logic-in-space-invaders-type-game April 09, 2021 at 10:08AM