js编写弹球弹珠问题

这个代码不能产生预期效果，请问出现了什么问题，谢谢！！：

img

html>
<html lang="en">
  <head>
    <title>弹球游戏title>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width,initial-scale=1.0"/>
    <link rel="stylesheet" type="text/css" href="../css/弹球游戏.css"/>
  head>
  <body>
    <h1>弹球游戏h1>
    <canvas>canvas>
    <script type="text/javascript" src="../js/弹球游戏.js">
    script>
  body>
html>

const canvas = document.querySelector('canvas');
const ctx = canvas.getContext('2d');

const width = canvas.width = window.innerWidth;
const height = canvas.height = window.innerHeight;

function random(min,max) {
  const num = Math.floor(Math.random()*(max-min))+min;
  return num;
}
function randomColor() {
  const color =  "rgb("+ random(0,255) + "," + random(0,255) + "," + random(0,255)+ ")";
  return color;
}

class Ball {
  constructor(x,y,Vx,Vy,color,size) {
    this.x = x;
    this.y = y;
    this.Vx = Vx;
    this.Vy = Vy;
    this.color = color;
    this.size = size;
  }
  draw() {
    ctx.beginPath();
    ctx.fillStyle = this.color;
    ctx.arc(this.x,this.y,this.size,0,2*Math.PI);
    ctx.fill();
  }
 update() {
    if ((this.x + this.size) >= width) {
      this.velX = -(this.velX);
    }

    if ((this.x - this.size) <= 0) {
      this.velX = -(this.velX);
    }

    if ((this.y + this.size) >= height) {
      this.velY = -(this.velY);
    }

    if ((this.y - this.size) <= 0) {
      this.velY = -(this.velY);
    }

    this.x += this.velX;
    this.y += this.velY;
  }
  collisionDetect() {
    for(let j = 0; j < balls.length; j++) {
      if(this !== balls[j]) {
        const dx = this.x - balls[j].x;
        const dy = this.y - balls[j].y;
        const distance = Math.sqrt(dx * dx + dy * dy);
        if (distance < this.size + balls[j].size) {
          balls[j].color = this.color = randomColor();
        }
      }
    }
  }
}

let balls = new Array;
while(balls.length<25) {
  const size = random(10,20);
  let ball = new Ball(
    random(0 + size, width - size),
    random(0 + size, height - size),
    random(-7, 7),
    random(-7, 7),
    randomColor(),
    size
  );
  balls.push(ball);
};

function loop() {
  ctx.fillStyle = 'rgba(0,0,0,0.25)';
  ctx.fillRect(0,0,width,height);

  for(let i = 0; i < balls.length; i++) {
    balls[i].draw();
    balls[i].updata();
    balls[i].collisionDetect();
  }

  requestAnimationFrame(loop);
}

loop();

balls[i].update();
loop 里写错 了 写成updata了