1
resposta

Dificuldade nesse exercício

Eu não entendi muito bem o comentário do instrutor e nem se eu fiz o que o exercício realmente queria, alguém pode me ajudar? O meu código ficou assim:

<canvas width="600"  height="400"></canvas>

<script>
    var tela = document.querySelector('canvas');
    var pincel = tela.getContext('2d');

    pincel.fillStyle = 'grey';
    pincel.fillRect(0, 0, 600, 400);

    var cores = ['blue', 'red', 'green', 'purple', 'black', 'lightgrey'];
    var clique = 0;
    var raio = 10;


    function desenhaCirculo(evento) {

        var x = Math.round(evento.pageX - tela.offsetLeft);
        var y = Math.round(evento.pageY - tela.offsetTop);



                        if(evento.shiftKey) {

                            raio = raio + 10;

                            if(raio >= 40) {

                                raio = 10;
                            }


                            }

                            if(evento.altKey) {

                                raio = raio - 5;
                        }




        pincel.fillStyle = cores[clique];
        pincel.beginPath();
        pincel.arc(x, y, raio, 0, 2 * 3.14);
        pincel.fill();


    }


    function mudaCor() {


                clique++;


            if(clique >= cores.length) {


                clique = 0;

            } 


            alert("Sua cor agora é " + cores[clique]);
            return false;

        }



    tela.onclick = desenhaCirculo;
    tela.oncontextmenu = mudaCor;


</script>

Ah, e poderia me dizer o que é "if else" quando estão juntos?

1 resposta

Olá, Juliana! Tudo bem contigo?

Neste cenário não dá para vermos a diferença entre utilizar somente ifou if e else

Vamos utilizar o padrão if e elsepara ver o comportamento

<script>

    var x = 25;

    if (x > 0) {
        document.write("Maior que zero");        
    } else if (x > 10) {
        document.write("Maior que dez"); 
    } else if (x > 20) {
        document.write("Maior que 20");
    }

</script>

Neste caso, veja que temos uma variável xque recebe o valor 25e nos três if'sele é verdadeiro, porém ao rodar ele vai pegar somente o primeiro e já sai da condicional. Ele ignora os demais. Sempre considerando a seguinte premissa: "Se for maior que zero faça tal coisa, Senão Se for maior que dez faça a outra coisa, Senão Se for maior que vinte faça a última instrução". Como a primeira é verdadeira, faz a primeira e ignora as demais.

Agora vamos para um outro cenário onde não utilizamos o else

<script>

    var x = 25;

    if (x > 0) {
        document.write("Maior que zero");        
    } 
    if (x > 10) {
        document.write("Maior que dez"); 
    } 
    if (x > 20) {
        document.write("Maior que 20");
    }

</script>

Agora o comportamento é totalmente diferente. Sem o elsetodas as premissas são verdadeiras (como no primeiro caso), mas ele vai entrar em todas, não ignora como no primeiro cenário. Ele vai imprimir todas as três situações.

Caso queira se aprofundar, dê uma olhada nessa documentação sobre If e Else

Espero ter ajudado, Juliana!

Um abraço e bons estudos