Entrar Ainda não tem acesso?
2
respostas

[Dúvida] Não consigo entender porque não funciona

Referente ao curso JavaScript e HTML: pratique lógica com desenhos, animações e um jogo, no capítulo Extraindo funções e atividade Esquadro #2

por Estudante
| 40k xp | 3 posts

Boa noite, Estou tentando fazer esse exercicio e não consigo entender porque não funciona. Ele só funciona quando declaro os arrays dentro da função com o nome dos parametros passados na chamada da função. Não deveria ser os parametros declarados na criação da função?

<script>

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


    function esquadro(xA, yA, xC, yC, cor) {

        for (var i = 0; i < cor.length; i++) {
            pincel.fillStyle = cor[i]
            pincel.beginPath();
            pincel.moveTo(xA[i], yA[i]);
            pincel.lineTo(xA[i], yC[i]);
            pincel.lineTo(xC[i], yC[i]);
            pincel.fill();
        }
    }

    var valorXA = [50, 100];
    var valorXC = [400, 275];
    var valorYA = [50, 175];
    var valorYC = [400, 350];
    var cores = ['black', 'white'];

    esquadro(valorXA, valorXC, valorYA, valorYC, cores);
</script>
2 respostas
por RUANA SAMYRA MALHEIROS DAVILA
| 135.2k xp | 22 posts
It assistant/ Desenvolvedora Back end.

Nossa, já descobriu como corrigir? Eu também gostaria de aprender essa.

por Estudante
| 40k xp | 3 posts

Encontrei Ruana, No momento de chamar a função esquadro, estava passando os parametros na sequencia incorreta. Depois de ajustar a sequencia consegui atingir o resultado esperado. O codigo ficou assim:

<script>

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


    function esquadro(xA, yA, xC, yC, cor) {

        for (var i = 0; i < cor.length; i++) {
            pincel.fillStyle = cor[i]
            pincel.beginPath();
            pincel.moveTo(xA[i], yA[i]);
            pincel.lineTo(xA[i], yC[i]);
            pincel.lineTo(xC[i], yC[i]);
            pincel.fill();
        }
    }

    var valorXA = [50, 100];        
    var valorYA = [50, 175];
    var valorXC = [400, 275];
    var valorYC = [400, 350];
    var cores = ['black', 'white'];

    esquadro(valorXA, valorYA, valorXC, valorYC, cores);
</script>