uma pequeno esclarecimento

Victor, precisa criar a variável para que o "mundo" javascript consiga se comunicar com o HTML.

Todo o arquivo é um HTML, apenas aquele pedaço entre o "script" é JavaScript.

O herói principal aí não é a variável em si mas sim o poder do document.querySelector que busca a informação que queremos no HTML.

Bom Dia Victor, fique tranquilo, é comum as pessoas não entenderem isso no começo! Vou te explicar, basicamente, o JavaScript atua como uma "extensão" do HTML, ou seja, ele atua sobre as tags HTML (vamos desconsiderar o fato de que é sim possível fazer uma webapp inteira em JavaScript, mas nesse contexto que você está programando é raro, pois o HTML e o CSS garantem muito mais precisão no posicionamento dos elementos) e ele precisa referenciar através do document.querySelector o elemento a ser acessado, modificado e devolvido ao HTML. Pense assim, você tem um boneco do Batman (que seria nossa tag button), e acha ele muito sem graça pois ela não faz nada, ela é estática, assim como o HTML, e você quer fazer ele se mover e falar, bom, você irá pegar um pequeno auto falante e uma articulação para colocar nele, o que seria o nosso JavaScript. O JavaScript que dá movimento e dinâmica ao nosso "Batman", mas ele precisa existir para que isso aconteça não é mesmo? Bom, espero ter esclarecido suas dúvidas, se te ajudei, marque o tópico como solucionado ;)