[Dúvida] Quando usar await? | JavaScript: criando requisições

No vídeo, é apresentado essa função assíncrona:

async function buscaVideos(termoDeBusca){
    const conexao = await fetch(`http://localhost:3000/videos?q=${termoDeBusca}`);
    const conexaoConvertida = conexao.json();
    return conexaoConvertida;
}

Tenho uma dúvida de quando devo utilizar await.

No caso dessa linha: const conexao = await fetch(http://localhost:3000/videos?q=${termoDaBusca}); o await é utilizado no fetch para "esperar" a requisição e, ao concluir, atribuir o que foi recebido à cons conexao.

Beleza, até aí tudo bem.

Na linha seguinte: const conexaoConvertida = conexao.json(); Não seria necessário utilizar await antes de conexao.json() , para que o valor atribuido a conexaoConvertida seja atribuído corretamente?

Oi Alexander, tudo bem?

Agradeço por trazer sua dúvida sobre o uso do await no código apresentado. Vou tentar explicar de forma clara quando e por que devemos utilizar o await.

No trecho de código que você mencionou, o await é utilizado no fetch para aguardar a conclusão da requisição e receber o resultado antes de prosseguir com a execução do código. Isso ocorre porque o fetch retorna uma Promise, que é uma representação de um valor que pode estar disponível agora, no futuro ou nunca. Ao utilizar o await no fetch, você garante que o código irá esperar até que a requisição seja concluída e o valor retornado pela Promise esteja disponível.

No entanto, na linha seguinte, quando temos const conexaoConvertida = conexao.json();, não é necessário utilizar o await. Isso ocorre porque o método json() também retorna uma Promise, que representa o resultado da conversão dos dados da resposta em formato JSON. No entanto, diferentemente do fetch, o json() não faz uma requisição externa, ele apenas realiza uma operação local nos dados já recebidos.

Então, por que não precisamos utilizar o await antes de conexao.json()? É porque, nesse caso, não estamos aguardando um resultado externo como no fetch. O json() já está sendo chamado após a conclusão da requisição no fetch, pois a execução segue de forma sequencial. Quando o fetch é concluído, a linha seguinte é executada imediatamente.

No entanto, devemos lembrar que o método json() também retorna uma Promise, então é possível utilizar o await caso você precise obter diretamente o resultado da conversão para JSON. Nesse caso, você poderia modificar o trecho de código para:

const conexaoConvertida = await conexao.json();

Assim, o código iria aguardar a conclusão da conversão para JSON antes de prosseguir para a próxima linha.

Portanto, o uso do await depende do contexto em que estamos lidando com Promises. Utilizamos o await quando queremos aguardar a conclusão de uma operação assíncrona antes de prosseguir com a execução do código. No caso do fetch, que é uma operação assíncrona que faz uma requisição externa, é necessário utilizar o await para aguardar a resposta. No caso do json(), que é uma operação local nos dados já recebidos, não é necessário utilizar o await, a menos que você queira obter diretamente o resultado da conversão para JSON.

Espero que essa explicação tenha esclarecido a sua dúvida.

Um abraço e bons estudos.

Mergulhe em programação