Não consigo fazer a função desenhaTexto(); funcionar

Olá, Maria Eugênia! Tudo bem? Espero que sim!!!

Podemos fazer algumas alterações nesse código. Vamos lá!!!

Primeiro, no início, vamos colocar uma tag meta só para não termos erro de acentuação, caso queira escrever outros textos dentro do código:

<meta charset="UTF-8">

A variável tela e a variável pincel devemos colocá-la dentro da função desenhaTexto:

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

o for, no final do código, não precisa ser chamado. Podemos retirar os desenhaQuadrado e chamá-los fora da função logo abaixo da funao desenhaTexto, passando somente o valor da variável y:

var y = 50;
    desenhaQuadrado(50, y, 100, 'green');
    desenhaQuadrado(150, y, 100, 'green');
    desenhaQuadrado(250, y, 100, 'green');

E por último, vamos colocar dentro da função desenhaQuadrado a variável tela e a variável pincel:

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

Segue o código completo:

<meta charset="UTF-8">
<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);
    }

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

    var y = 50;
    desenhaQuadrado(50, y, 100, 'green');
    desenhaQuadrado(150, y, 100, 'green');
    desenhaQuadrado(250, y, 100, 'green');

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

</script>

Espero ter ajudado, Maria Eugênia!!!

Bons estudos e vamos em frente!!! ;-)

Obrigada, Cássio! Me ajudou bastante, o for eu tinha colocado mais para eu praticar, pois tenho dificuldade com a lógica por trás dele às vezes. Mas no final nem acabou ajudando.