[Projeto] Fiz dessa maneira usando o For

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

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);    
}



  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.fillStroke = "black";
    pincel.strokeRect(x, y, tamanho, tamanho);
  }
  var x = 50
  for(x; x < 200; x = x + 50){
    desenhaQuadrado(x, 50, 50, 'green')
  }
  desenhaQuadrado(200, 50, 50, 'white')

  desenhaTexto("Qual é a fração?", 50, 30);

</script>