funcion dibujarCuadrado

cambia tu codigo y pone esto en el if (x<=600)

Hola Carlos, encontré 2 fallas en tu código:

En el for el contador empieza en 0 así que tenes que usar contador<cantidad como condición, sino estarías imprimiendo 41 cuadrados, siempre uno más de los que pases como parametro. Sino tendrías que iniciar el contador en 1.

Las instrucciones que dibujan cada cuadrado deben estar fuera del if, porque de la forma que lo habías puesto se salteaba un cuadrado por linea. Cuando tocaba el else no dibujaba ningun cuadrado pero igualmente el for incrementaba el contador.

Con estos dos errores tenias la diferencia, 1 cuadrado de más y luego restabas 3, por eso te faltaban siempre 2.

Espero se entienda! Fue bastante complicado encontrar la solución :-)

Así quedaría funcionando correctamente:

<canvas width="700" height="400" ></canvas>
<script>    

   function dibujarCuadrado(cantidad){

      var pantalla = document.querySelector('canvas');
      var pincel = pantalla.getContext('2d');
      x = 0;
      y=0;
      for (contador =0; contador<cantidad;contador++){
        pincel.fillStyle = 'green';
        pincel.fillRect(x,y,50,50);
        pincel.fillStyle = 'black';
        pincel.strokeRect(x,y,50,50);

        if (x<600){
            x = x+50;
        } else {
            y=y+50
            x =0
        }
      }
   }

   dibujarCuadrado(40)

</script>

Slds!

muchisimas gracias ♥