No código, não definimos nenhuma estrutura de repetição, porque a bolinha se movimenta sem parar?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Solucionado
No código, não definimos nenhuma estrutura de repetição, porque a bolinha se movimenta sem parar?
Oi oi, Moises! Espero que esteja tudo bem com você!
Seu questionamento é muito pertinente e faz todo o sentido. Para compreendermos melhor precisamos entender o que é o P5 e como ele funciona, vamos lá?
p5.js é uma biblioteca JavaScript para codificação criativa, com foco em tornar a codificação acessível e inclusiva para artistas, designers, educadores, iniciantes e qualquer outra pessoa! O p5.js é gratuito e de código aberto porque acreditamos que o software e as ferramentas para aprendê-lo devem ser acessíveis a todos.
Usando a metáfora de um sketch, p5.js tem um conjunto completo de funcionalidades de desenho. No entanto, você não está limitado à sua tela de desenho. Você pode pensar em toda a página do navegador como um esboço/sketch, incluindo objetos HTML5 para texto, entrada, vídeo, webcam e som.
Mas o que isso significa?
Devido ao p5.js ter sido desenvolvido para ser acessível, a biblioteca vem com inúmeras funções pré-prontas, justamente para facilitar o processo de escrita do código. Sendo assim, a função draw() é uma dessas soluções que já estão incluídas na biblioteca para facilitar a vida do desenvolvedor. E como a função draw() funciona?
Chamada diretamente após setup (), a função draw () executa continuamente as linhas de código contidas em seu bloco até que o programa seja interrompido ou noLoop () seja chamada. A draw () é chamada automaticamente e nunca deve ser chamada explicitamente.
Deve sempre ser controlada com noLoop (), redraw () e loop (). Depois que noLoop () interrompe a execução do código em draw (), redraw () faz com que o código dentro de draw () seja executado uma vez e loop () fará com que o código dentro de draw () retome a execução continuamente. (...)
Só pode haver uma função draw () para cada sketch, e draw () deve existir se você quiser que o código seja executado continuamente ou para processar eventos como mousePressed (). Às vezes, você pode ter uma chamada vazia para draw () em seu programa, (...)
(...)
Mas o que isso significa?
A function draw() é a função que faz a "mágica acontecer". E essa função já pré-pronta na biblioteca p5.js que irá desenhar os elementos no ambiente de visualização. Um aspecto interessante da função é que ela funciona como se possuísse um loop , o que faz com que o código escrito em seu escopo seja executado continuamente.
Além de não precisarmos declará-la, pois já está contida na biblioteca do p5.js de forma padrão, tudo o que inserirmos em seu interior será repetido e é por isso que a bolinha se movimenta sem parar. :)
Vou deixar aqui os links que redirecionam para a fonte de informações, que é a sessão de referência do p5.js
Reference do p5.js que explica detalhadamente o que é a function draw()
Home do p5 com informações sobre a biblioteca
Espero que tenha conseguido ajudá-lo!
Em caso de dúvidas ou se quiser compartilhar seu progresso, estamos à disposição!
Um grande abraço e até breve!
muito obrigado, foi muito esclarecedor, agora sim faz mais sentido abraço vlw