Accessing other classes inside a class Javascript

Question

I am trying to make a simple breakout game with p5js. I got the balls to work fine, but when I try to make them interact with the brick class, I run into some problems. I can't seem to figure ourI don't have a ton of experience with classes in javascript, so this is a little confusing to me. Here is the code:

`

//Variables
let scene = 0;
let paddlex = 250;
let paddlespeed = 10;
let allBalls = [];

class Brick {
  constructor(brickX, brickY, brickW, brickH) {
    this.brickX = brickX
    this.brickY = brickY
    this.brickW = brickW
    this.brickH = brickH
    this.brickAlive = true
  }
  display(){
    push()
    if(this.brickAlive){
      fill("red")
      rect(this.brickX, this.brickY, this.brickW, this.brickH)
    }
    pop()
  }
}
class Ball {
  constructor(x, y, w, xdir, ydir) {
    this.x = x;
    this.y = y;
    this.w = w;
    this.xdir = xdir;
    this.ydir = ydir;
    this.alive = true;
    allBalls.push(this);
  }
  move() {
    this.x += this.xdir;
    this.y += this.ydir;
    //Bounce off walls
    if (this.x >= 600 - this.w / 2) {
      this.xdir = this.xdir * -1;
    }
    if (this.x <= 0 + this.w / 2) {
      this.xdir = this.xdir * -1;
    }
    if (this.y <= 0 + this.w / 2) {
      this.ydir = this.ydir * -1;
    }
    if (this.y >= 400 + this.w / 2) {
      this.alive = false;
    }
    if (
      this.y >= 360 - this.w / 2 &&
      this.y <= 380 &&
      this.x >= paddlex &&
      this.x <= paddlex + 100
    ) {
      this.ydir = this.ydir * -1;
    }
  }
  show() {
    if (this.alive) {
      push();
      fill(0);
      ellipse(this.x, this.y, this.w, this.w);
      pop();
    }
  }
  //I believe this part is causing the error
  collide(brick){
    if(this.x >= brick.brickX && this.x <= brick.brickX + brick.brickW && this.y <= brick.brickY + brick.brickH){
      console.log("HI")
      brick.brickAlive = false
    }
  }
}

`

I recieved an error that said "TypeError: Cannot read properties of undefined (reading 'brickX')"