1
resposta

Exercício frações

Olá! Eu resolvi o exercício de maneira diferente, deu tudo certo! Mas eu gostaria de entender o motivo pelo qual é especificado para utilizar no parâmetro da função "tamanho".

<meta charset="utf-8">
<canvas height="600" width="400"></canvas>
<script>

    function desenhaQuadrado(x,y,cor) {
        var tela = document.querySelector('canvas');
        var pincel = tela.getContext('2d');
        pincel.fillStyle = cor;
        pincel.fillRect(x,y,50,50);
        pincel.strokeStyle = 'black';
        pincel.strokeRect(x,y,50,50);

    }
//criando texto
    function desenhaTexto(texto,x,y){
        var tela = document.querySelector('canvas');
        var pincel = tela.getContext('2d');
        pincel.font = '20px Georgia';
        pincel.fillStyle = 'black';
        pincel.fillText(texto,x,y);
    }

    for(var x = 0; x < 150;x = x + 50){

        desenhaQuadrado(x,0,'green');

        } 


    desenhaQuadrado(x,0,'white');

    desenhaTexto("Qual é a fração?", 100,70);



</script>
1 resposta

Olá, Thamires! Tudo bem contigo?

Na verdade, a variável tamanho que foi criada no exercício, não teve muita diferença com o que você fez. O que mudou foi que em vez de chamar de "tamanho" você colocou o valor 50diretamente.

No exercício, quando chamado a função desenhaQuadradoespera-se receber um valor X, um valor Y, um valor tamanho e uma cor.

desenhaQuadrado(50, y, 100, 'green');

E quando passamos esses valores, o valor tamanhoé utilizado onde você colocou 50

Imgur

Agora vamos ao seu código!

Se acrescentarmos essa variável nos parâmetros da função e substituirmos o valor 50pela vaiável tamanho, devemos chamar o valor 50na invocação dessa função

<meta charset="utf-8">
<canvas height="600" width="400"></canvas>
<script>

    function desenhaQuadrado(x,y,tamanho,cor) {
        var tela = document.querySelector('canvas');
        var pincel = tela.getContext('2d');
        pincel.fillStyle = cor;
        pincel.fillRect(x,y,tamanho,tamanho);
        pincel.strokeStyle = 'black';
        pincel.strokeRect(x,y,tamanho,tamanho);

    }
//criando texto
    function desenhaTexto(texto,x,y){
        var tela = document.querySelector('canvas');
        var pincel = tela.getContext('2d');
        pincel.font = '20px Georgia';
        pincel.fillStyle = 'black';
        pincel.fillText(texto,x,y);
    }

    for(var x = 0; x < 150;x = x + 50){

        desenhaQuadrado(x,0,50,'green');

    } 

    desenhaQuadrado(x,0,50,'white');

    desenhaTexto("Qual é a fração?", 100,70);

</script>

Espero ter ajudado, Thamires!

Um abraço e bons estudos!