Poderia ser assim?

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

<script>

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

    function desenhaQuadrado(x, y, cor) {
        // body..
        pincel.fillStyle = cor;
        pincel.fillRect(x, y, 50, 50);
        pincel.strokeStyle = 'black';
        pincel.strokeRect(x, y, 50, 50);    

    }

    function desenhaTexto(texto, x, y) {

        pincel.font = '20px Georgia';
        pincel.fillStyle = 'black';
        pincel.fillText(texto, x, y);
        // body...
    }

    desenhaTexto('Qual é a fração?', 30, 80);

    for(var x = 0; x < 150; x = x + 50){

    desenhaQuadrado(x, 0, 'green');

    }

    desenhaQuadrado(150, 0, 'white');




</script>