DEV Community

Cover image for Javascript para iniciantes: Buscando dados de uma API
Luís Daví
Luís Daví

Posted on • Updated on

Javascript para iniciantes: Buscando dados de uma API

Hoje trouxe aqui um post para mostrar como usar a função “fetch()” do javascript, para buscarmos dados em uma API

Entendendo a estrutura do fetch()

function completed

O primeiro parâmetro da função é uma string, onde devemos passar a url da api

Primeiro parametro da função


No entanto, o segundo parâmetro da função é um objeto que contém a configuração da requisição. Essa configuração é definida por meio de variáveis como "method", para definir o método da requisição, que pode ser "GET", "POST", "PUT" ou "DELETE". Posteriormente, definimos a variável "body", que receberá um objeto contendo outras variáveis que o servidor da API utilizará para várias finalidades, como a variável "auth" para autenticação, entre outras.

segundo parametro


A partir daí, devemos usar o “.then” para podermos receber o conteúdo da nossa API. Devemos passar uma função dentro do .then; essa função terá um parâmetro que será a resposta. Antes de pegarmos o valor da resposta, devemos retornar para a função .then o formato em que iremos receber essa resposta. Já que na API "https://jsonplaceholder.typicode.com/todos/1” recebemos a resposta como um objeto, ou seja, no formato JSON, devemos retornar para o .then a nossa resposta no formato JSON, passando “response.json()”, como mostrado na imagem abaixo.

primeiro then


Já o segundo “.then” é utilizado para recebermos de fato o valor da resposta porém já formatado, ou seja, o javascript já irá saber que aquela valor será do formato que determinamos no “.then” anterior. Para pegarmos esse valor, dentro do “.then” iremos passar uma função com um parâmetro data, esse “data” será o nosso JSON recebido da api

segundo then


Post criado e publicado com 💙 por Luís Daví
👾Portifólio 🚀Github 📸Instagram

Top comments (0)