Exercício 1


a) Comparação:

  • Ex1-cep-fetch
    A função buscaEndereco() recebe um parâmetro cep, que é usado para construir uma URL para buscar os detalhes do endereço no servidor. Depois que a solicitação é feita, a função verifica se a resposta é ok e, em seguida, analisa os dados usando o método .json(). Se houver um erro, a função redefinirá o formulário e registrará o erro no console.

  • Ex3-cep-await
    A função buscaEndereco() neste exemplo também recebe um parâmetro cep. No entanto, neste caso, a função usa a palavra-chave await para aguardar a resposta do servidor. Se houver um erro na resposta, a função registrará o erro no console e retornará. Se a resposta estiver ok, a função analisará os dados usando o método .json(), e depois atualizará o formulário com os detalhes do endereço.

  • Resumo
    Em geral, ambas as funções realizam a mesma tarefa de buscar detalhes de endereço com base em um CEP fornecido. No entanto, Ex3-cep-await usa a sintaxe mais recente await, o que pode tornar o código mais fácil de ler e entender.


b) Prints:

Inicio (corpo do response):
print do inicio do item b
Fim (promise fullfilled e endereco preenchido):
print do fim do item b

d) Comentários:

(também está comentado no próprio código)

async function buscaEndereco(cep) {
    // Verifica se o comprimento do CEP é diferente de 9 caracteres e retorna se for o caso (não faz nada)
    if (cep.length != 9) return;

    // Tenta executar o código abaixo e, em caso de erro, imprime o erro no console e retorna
    try {

        // Faz uma chamada assíncrona à função fetch para buscar o endereço com base no CEP fornecido. 
        // O await aguarda a resposta da requisição antes de prosseguir para a próxima linha de código.
        let response = await fetch("busca-endereco.php?cep=" + cep);

        // Verifica se a resposta não é OK e lança um erro com a mensagem de status da resposta
        if (!response.ok) throw new Error(response.statusText);

        // Aguarda a conversão (novamente por meio do await) da resposta em formato JSON e o seu resultado 
        // é armazenado na variável endereco.
        var endereco = await response.json();
    }
    catch (e) {
        // Em caso de erro, imprime o erro no console e retorna
        console.error(e);
        return;
    }

    // Obtém o formulário pelo seletor "form"
    let form = document.querySelector("form");

    // Preenche os campos do formulário com os valores do endereço obtido na resposta
    form.rua.value = endereco.rua;
    form.bairro.value = endereco.bairro;
    form.cidade.value = endereco.cidade;
}