olá, no meu codigo eu nao coloquei a funçao limpaTela dentro do atualizatela mas coloquei pincel.fillStyle "lightgrey" e pincel.fillRect(0,0,600,400), e o codigo funcionou normalmente limpando a tela para o proximo desenho mas não entendi a logica alguem saberia explicar pq ele limpa mesmo sem eu pedir para limpar, pq eu entendo que pincel.fillstyle e pincel.fillRect a tela sempre vai ficar cinza dentro do canvas ate ai tudo bem, mas pq o alvo some
<canvas width="600" height="400"></canvas>
<script >
var tela= document.querySelector ("canvas");
var pincel = tela.getContext("2d");
var raio = 10;
pincel.fillStyle = "lightgrey"
pincel.fillRect (0,0,600,400);
function limpaTela(){
pincel.clearRect(0,0,600,400);
}
function desenhacirculo(x,y,raio,cor){
pincel.fillStyle =cor
pincel.beginPath();
pincel.arc(x,y,raio,0,2 * Math.PI);
pincel.fill();
}
function desenhaAlvo(x,y){
desenhacirculo(x,y,raio+20, "yellow")
desenhacirculo(x,y,raio+10,"blue")
desenhacirculo(x,y,10,"red")
}
function sorteiaPosicao(maximo){
return Math.floor(Math.random()*maximo)
}
function atualizaTela(){
//limpaTela()
pincel.fillStyle="lightgrey"
pincel.fillRect(0,0,600,400);
var xAlaeatorio = sorteiaPosicao (600);
var yAleatorio = sorteiaPosicao(400);
desenhaAlvo(xAlaeatorio,yAleatorio);
}
setInterval(atualizaTela,1000);
</script>