Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Eu não entendi o porque de fazer todos esses cálculos, os parâmetros já foram definidos, não é mais fácil apenas alterar o valor deles?

<meta charset="utf-8">

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

<script>

    function desenhaEsquadro(Xa, Ya, Xc, Yc, cor){

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

        pincel.fillStyle = cor;
        pincel.beginPath();
        pincel.moveTo(Xa, Ya);
        pincel.lineTo(Xa, Yc);
        pincel.lineTo(Xc, Yc);
        pincel.fill();

    }

    desenhaEsquadro(50, 50, 400, 400, 'black');
    desenhaEsquadro(100, 175, 275, 350, 'white');

</script>
2 respostas
solução!

Olá Nayara, tudo bem com você?

É sempre uma alternativa também! A grande questão é que da maneira do instrutor se quisermos fazer 3 desenhos de esquadro no canvas não precisamos ficar calculando manualmente todas as posições novamente, pois a função já faz isso para nós :)

Então muitas vezes, iremos querer que nossas funções já tenham um comportamento completo, para ser reutilizadas varias vezes sem ter que pensar muito nos valores!

Veja que fazendo sem essa conta a nossa função não cria de fato um "esquadro", na verdade está mais para um "triângulo retângulo", e apenas a chamada combinada da função como você fez que gera o esquadro, o que pode ser um pouco confuso

Mas para um exercício simples como esse, a maneira como você fez é super válida 😁😁😁

Abraços e Bons Estudos!

Eu fiz igual ao da Nayara. Achei mais simples do que ficar fazendo cálculos. O Flavio mesmo disse em alguma aula que o importante não seriam os cálculos matemáticos, mas a logica de programação em si.