Mostra bolinha não funciona

P.S.: Se eu pego a função mostra bolinha, copio ela desse mesmo jeito que está dando erro e colo abaixo dela, ficando o código duplicado, ele funciona. Não dá para entender

Olá Maria!

Esse é um erro simples mas que deixa a gente de cabelo em pé, no começo a gente leva até horas pra descobrir sozinho hahahaha

De maneira bem simples, quando compilamos e "rodamos" um código, o compilador vai lendo linha por linha, da primeira até a última, e toda vez que ele encontra um comando ou uma função ele vai na biblioteca da linguagem pra entender o que ele precisa fazer

E antes de rodar de fato, ele procura todas as funções do seu código e já carrega na memória o que precisa fazer quando encontrar uma referência a ela

Ou seja, o compilador leu seu código até a linha 31, até aí tudo bem, mas na hora que ele foi procurar a função movimentabolinha() ele não encontrou em lugar nenhum a explicação do que ela faz, por que você só explicou na linha 43(ele não chegou aí ainda)

Escrever a sua função antes da linha 31 ajudaria, mas não é a melhor coisa a se fazer, por que toda vez que a função draw() for carregada ele vai estar criando a função movimentabolinha() do zero

Então o jeito certo de arrumar esse erro é criar a sua função fora da função draw() depois do "}", dessa forma aqui:

// variáveis da bolinha
let xbolinha = 300;
let ybolinha = 200;
let diametro = 15;
let raio = diametro /2;

// velocidade da bolinha
let velocidadexbolinha = 6;
let velocidadeybolinha = 6;
let raquetecomprimento = 10;
let raquetealtura = 90;

//variáveis da raquete
let xraquete = 5;
let yraquete = 150;

//variáveis do oponente
let xraqueteoponente = 585;
let yraqueteoponente = 150;
let velocidadeyoponente;

let colidiu = false;

function setup() {
    createCanvas(600, 400);
}

function draw() { 
  background(0);
  mostrabolinha(); 
  movimentabolinha(); 
  verificacolisaoborda(); 
  mostraraquete(xraquete, yraquete); 
  movimentaminharaquete(); 

  //verificacolisaoraquete(); 
  //colisaoraquete() comentei essa linha pois essa função ainda não foi definida e estava dando erro
  mostraraquete(xraqueteoponente, yraqueteoponente); 
  //movimentaraqueteoponente() comentei essa linha pois essa função ainda não foi definida e estava dando erro
}

function mostrabolinha(){ 
    circle(xbolinha, ybolinha, diametro); 
}

function movimentabolinha(){
  //xbolinha += velocidadexbolinha;
  ybolinha += velocidadeybolinha; 
}

function verificacolisaoborda(){
  if (xbolinha + raio> width || xbolinha - raio< 0){
    velocidadexbolinha *= -1;
  }
  if (ybolinha + raio> height || ybolinha - raio < 0){
    velocidadeybolinha *= -1; } 
  }

function mostraraquete (x,y){
  rect (x, y, raquetecomprimento, raquetealtura );
}


function movimentaminharaquete (){
  if (keyIsDown(UP_ARROW)){
    yraquete -= 10;
  }
  if (keyIsDown(DOWN_ARROW)){
    yraquete += 10;
  }
} 

function verificacolisaoraquete(){
  if (xbolinha - raio < xraquete + raquetecomprimento && ybolinha - raio < yraquete + raquetealtura && ybolinha + raio > yraquete){
    velocidadexbolinha *= -1;
  }
}

Perceba que eu comentei algumas funções que ainda não tinham sido definidas, para não dar erro de novo, caso queira defini-las e usá-las é só tirar o // e apagar o texto que escrevi na frente

Espero que tenha ficado claro, qualquer dúvida é só me mandar mensagem aqui

Bons estudos!