constructor(xSpeed0, ySpeed0) {

    this.xPos = random(100, 300);

    this.yPos = random(100, 300);

    this.xSpeed = xSpeed0;

    this.ySpeed = ySpeed0;

  }

​

  move() {

    // move the ball

    this.xPos += this.xSpeed;

    this.yPos += this.ySpeed;

  }

​

  checkForCollisions() {

    // check first for left and right wall

    if (this.xPos <= 15 || this.xPos >= width - 15) {

      this.xSpeed = -this.xSpeed;

    }

​

    // do the same for the ceiling and the floor

    if (this.yPos <= 15 || this.yPos >= height - 15) {

      this.ySpeed = -this.ySpeed;

    }

  }

​

  draw() {

    circle(this.xPos, this.yPos, 30);

  }

}

​

let ball = [];

​

function setup() {

  createCanvas(400, 400);

  for (let i = 0; i < 50; i++) {

    // each ball will have a slightly different

    // initial speed in the X axis, but all balls

    // will have the same speed in the Y axis

//     50 is the number of balls

    ball[i] = new BouncingBall(i + 1, 2);

  }

}

​

function draw() {

  background(240);

​

  for (let i = 0; i < ball.length; i++) {

    ball[i].move();

    ball[i].checkForCollisions();

    ball[i].draw();

  }

}

// ball.length gets the lenght from the for loop and then you can only change one number to strict how many balls to have