Fração usando For()

<meta charset="utf-8">

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

<script>

function desenhaQuadrado(x, y, cor) {

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

    pincel.fillStyle = cor
    pincel.fillRect(x, 150, 50, 50);
    pincel.fillStroke = 'black';
    pincel.strokeRect(x, 150, 50, 50);
    pincel.fillStroke = ''
}
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);    
}
desenhaTexto("Por: Jander Pinto Sidrão", 50, 30);
desenhaTexto("Qual é a fração?", 50, 60);
desenhaTexto("Quatro quintos", 50, 90);

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

        desenhaQuadrado(x,0,'orange');
        desenhaQuadrado(200,0,'white');
    }

</script>