Extraindo Frações - Ex: Frações

Olá Andréia! Na função abaixo

pincel.fillRect(x, y, tamanho, tamanho);

você coloca a variável tamanho duas vezes porque o primeiro tamanho refere-se à largura (width) e o segundo tamanho refere-se à altura (height). Como a largura e a altura são iguais não há necessidade de você referenciar essas medidas duas vezes na função. Basta colocar tamanho uma única vez, que o mesmo valor vai para a largura e a altura.

Complementando...

Caso a largura e a altura fossem diferentes, aí sim, você precisaria de dois valores na função. Fiz essa alteração abaixo no seu código

<canvas id="tela" width="700" height="500" ></canvas>
<script>

  function desenhaQuadrado(x, y, largura, altura, cor) {

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

      pincel.fillStyle = cor;
      pincel.fillRect(x, y, largura, altura);
      pincel.strokeStyle = 'black';
      pincel.strokeRect(x,y,largura,altura);
  }

  desenhaQuadrado(50, 50 , 100, 200, 'green');
  desenhaQuadrado(150, 50 , 100, 200, 'green');
  desenhaQuadrado(250, 50 , 100, 200, 'green');
  desenhaQuadrado(350, 50 , 100, 200, 'white');

</script>

Testa aí e nos dê uma alô!

Abraços e sucesso nos estudos!

Veja que o nome da função é desenhaQuadrado. Como a largura e altura do quadrado é a mesma, a função recebe apenas um e passa para fillReact o mesmo valor.

Entendi, porém eu estava comparando com o exercício: "Uma função mais genérica", onde os parâmetros da função são apenas as coordenadas x e y, e no pincel.fillRect os valores dos lados são chamados 2 vezes, mesmo sendo iguais, isso que confundiu, pq nesse caso é chamado apenas uma, certo? pincel.fillRect(x, y, 50, 50);

Você também pode fazer dessa forma neste exercício, já que o tamanho dos quadrados não varia. Em programação existem diversas maneiras para chegarmos ao mesmo resultado, o código com mais parâmetros é mais genérico, te permite alterar o tamanho do quadrado além de posicioná-lo e definir sua cor, mas nada impede de você fazer o código deste exercício de frações assim também:

<canvas id="tela" width="700" height="500" ></canvas>
<script>    

  function desenhaQuadrado(x, y, cor) {

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

      pincel.fillStyle = cor;
      pincel.fillRect(x, y, 100, 100); 
      pincel.strokeStyle = 'black';
      pincel.strokeRect(x,y, 100, 100); 
  }

  desenhaQuadrado(50, 50 , 'green');
  desenhaQuadrado(150, 50 , 'green');
  desenhaQuadrado(250, 50 ,  'green');
  desenhaQuadrado(350, 50 ,  'white'); 

</script>

Entendeu?

Entendi sim, muito obrigada André e prof Flavio!