Oii, Geraldo!
A razão pela qual o Guilherme invocou a função getBuscarLivrosDaApi
antes de sua declaração é devido ao conceito de "hoisting" em JavaScript. O hoisting é um comportamento padrão do JavaScript onde declarações de variáveis e funções são movidas para o topo do seu contexto de execução antes do código ser executado. Isso significa que você pode chamar uma função antes de sua declaração no código, desde que ela seja declarada usando a palavra reservada function
.
No seu exemplo:
let livros = [];
const endpointApi = 'https://guilhermeonrails.github.io/casadocodigo/livros.json';
getBuscarLivrosDaApi();
async function getBuscarLivrosDaApi() {
const res = await fetch(endpointApi);
livros = await res.json();
console.log(livros);
}
A função getBuscarLivrosDaApi
é declarada com a palavra reservada function
, o que permite que ela seja "hoisted" para o topo do seu escopo, tornando possível chamá-la antes de sua definição.
No entanto, se você usar uma função de seta (arrow function) ou uma função atribuída a uma variável, isso não funcionará da mesma maneira. Veja o exemplo abaixo:
let livros = [];
const endpointApi = 'https://guilhermeonrails.github.io/casadocodigo/livros.json';
getBuscarLivrosDaApi(); // Isso causará um erro
const getBuscarLivrosDaApi = async () => {
const res = await fetch(endpointApi);
livros = await res.json();
console.log(livros);
};
Neste caso, getBuscarLivrosDaApi
é uma constante que recebe uma função assíncrona, mas essa constante não é "hoisted". Portanto, ao tentar chamá-la antes de sua definição, você receberá um erro de referência.
Um abraço e bons estudos.