11 Assincronismo e APIs
Nem toda tarefa no JavaScript termina imediatamente.
Chamamos isso de comportamento assíncrono.
Exemplos:
- requisições de rede;
- leitura de arquivos;
- timers (
setTimeout,setInterval).
11.1 Entendendo a ordem de execução
console.log("Início")
setTimeout(() => {
console.log("Executou depois de 2 segundos")
}, 2000)
console.log("Fim")Saída esperada:
InícioFimExecutou depois de 2 segundos
11.2 Promises
Promise representa um resultado futuro: pendente, resolvido ou rejeitado.
function buscarDados() {
return new Promise((resolve) => {
setTimeout(() => resolve("Dados carregados"), 1000)
})
}
buscarDados().then((mensagem) => console.log(mensagem))Com erro:
function validarIdade(idade) {
return new Promise((resolve, reject) => {
if (idade >= 18) resolve("Acesso liberado")
else reject(new Error("Acesso negado"))
})
}11.3 async/await
async e await deixam o código assíncrono mais legível.
async function executar() {
const resposta = await buscarDados()
console.log(resposta)
}
executar()11.4 Tratamento de erros com try/catch
async function testarIdade() {
try {
const msg = await validarIdade(16)
console.log(msg)
} catch (erro) {
console.error("Erro:", erro.message)
}
}
testarIdade()11.5 Consumindo API com fetch
async function carregarUsuarios() {
const response = await fetch("https://jsonplaceholder.typicode.com/users")
const usuarios = await response.json()
console.log(usuarios)
}
carregarUsuarios()11.6 Verificando status HTTP
async function buscarPost(id) {
const response = await fetch(`https://jsonplaceholder.typicode.com/posts/${id}`)
if (!response.ok) {
throw new Error(`Falha HTTP: ${response.status}`)
}
return response.json()
}11.7 Exemplo prático: previsão do tempo
Fluxo comum:
- usuário escolhe cidade;
- aplicação chama API;
- mostra temperatura e condição do clima;
- em erro, exibe mensagem amigável.
async function carregarClima(url) {
try {
const response = await fetch(url)
if (!response.ok) {
throw new Error("Não foi possível buscar o clima")
}
const dados = await response.json()
console.log(dados)
} catch (erro) {
console.error("Erro ao carregar clima:", erro.message)
}
}11.8 Exercícios
- Faça uma função assíncrona que aguarde 3 segundos e retorne mensagem.
- Consuma uma API pública e mostre apenas os nomes retornados.
- Trate erros com
try/catchnofetch. - Crie função que busque um post por ID e valide status da resposta.
- Desafio: montar tela com busca e carregamento (
loading) para uma API.