Outra solução

Resolvi de outra maneira.

Criei um loop para verificar qual cor estava selecionada na variável cor, e depois incrementava o índice do array para pegar a próxima cor. Se o índice incrementado ultrapassasse a quantidade itens do array, o mesmo era zerado novamente.

Parece que ficou um pouco trabalhoso, mas foi a solução que encontrei.

<meta charset="UTF-8">
<canvas width = "600" height = "400"></canvas>

<script>

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

    pincel.fillStyle = 'lightgrey';
    pincel.fillRect(0, 0, 600, 400);


    function desenhaCirculo(evento){
        var x = evento.pageX - tela.offsetLeft;
        var y = evento.pageY - tela.offsetTop;

        pincel.fillStyle = cor;
        pincel.beginPath();
        pincel.arc(x, y, 10, 0, 2 * 3.14);
        pincel.fill();    
        console.log(x + ', ' + y);

    }

    var cores = ['blue', 'red', 'green'];
    var cor = cores[0];


    function mudaCor(){
        var i = 0;

        while(cor !== cores[i]){
            i++;
        }

        i++;

        if(i >= cores.length){
            i = 0;
        }

        cor = cores[i];
        return false;

    }

    tela.oncontextmenu = mudaCor;

    tela.onclick = desenhaCirculo;



</script>