Duvida sobre função dentro de função!

Indo um pouco além da parte proposta fiz meu código da seguinte maneira:

<meta charset="utf-8">
<script>

    function breakLine(number) {
        var amount = number;
        for (i = 0; i < amount; i++) {
            document.write("<br>");
        }
    }

    function showText(text, number) {
        document.write(text);
        breakLine(number);
    }

  var ano = 2020

    showText("Lucas tem " + (ano - 1994), 1);
    showText("Flávio tem " + (ano - 1965), 2)
    showText("João tem " + (ano - 1977), 0)

</script>

Porém ele pula a quantidade de linhas erradas quando coloco var amount = number; Ficando correto somento quando suprimo o var, desta meneira:

<meta charset="utf-8">
<script>

    function breakLine(number) {
        amount = number;
        for (i = 0; i < amount; i++) {
            document.write("<br>");
        }
    }

    function showText(text, number) {
        document.write(text);
        breakLine(number);
    }

  var ano = 2020

    showText("Lucas tem " + (ano - 1994), 1);
    showText("Flávio tem " + (ano - 1965), 2)
    showText("João tem " + (ano - 1977), 0)

</script>

Gostaria de entender o porque isso acontece