fetch : A função mais importante do Javascript 🙃

Introdução

Escolher a função mais importante depende do cenário específico em que você está aplicando a linguagem Javascript.

A importância de uma função depende das necessidades do projeto, contexto em que se está trabalhando e da tarefa que se pretende realizar.

Se o critério de escolha da função for : A função mais importante em termos de impacto e utilidade geral no desenvolvimento web moderno, “fetch” é a mais importante.

Oque é fetch Javascript

A função fetch ou Fetch API, é uma API de busca do Javascript que permite realizar requisições HTTP assíncronas entre uma aplicação web e recursos externos.

A função fetch é nativa do navegador e está disponível no ambiente de execução do Javascript em navegadores modernos.

As requisições neste método são feitas de forma assíncrona que significa o não-bloqueio da execução da aplicação enquanto aguarda a resposta do servidor.

Estrutura da função fetch

A estrutura do fetch é simples. Pode ser feita de duas formas, uma obrigatória e outra opcional.

Ex1: Estrutura obrigatória do metodo fetch



Ex2: Estrutura opcional do metodo fetch

Descrição:

1. url: É o endereço para o qual você pretende fazer a requisição.
2. options: (opcional o uso) - Esse é um objeto que contem várias opçoes para configurar a requisição. Incluindo metodos HTTP( GET.POST,etc), informaçoes do corpo da requisição etc.
3. .then(): Receber a response que representa a resposta da requisição, quando a promessa fetch é resolvida com sucesso. Podemos usar os diversos métodos do objeto response, como : .json(); .text(); .blob() entre outros para processar o conteudo da resposta no formato desejado.
4. .catch(): responsavel por ler a mensagem de erro se a promessa falhar ou ser rejeitada.

Funcionamento da função fetch

O domínio da funcção fetch é justamente lidar com requisições HTTP de maneira simples e flexível.

1. Qando chamados fetch(url) o navegador inicia uma solicitação para a url fornecida.
2. A promessa retornada permite que tratemos a resposta de forma assíncrona, processando-a como um objeto Response.
3. Podemos então utilizar métodos como: “.json()”, “.tetx()” ou “ .blob()”, para obter os dados em diferentes formatos, dependendo das nossas necessidades.

Exemplo de utilização / aplicação do comando

Suponha que: “Em um aplicativo de metereologia, se pretende saber se hoje vai chover ou não”

O aplicativo vai precisar consumir uma API que forneça informações metereológicas, e uma API comum para isso é a OpenWeatherMap, que por meio de uma apiKey ela te permite enviar requisições a sua API.

A nível do javascript, à pergunta e a resposta do estado do clima de hoje em relação a chuva ou não, serão feitas seguindo o código abaixo.

Ex.



Neste exemplo, a API retorna uma descrição do tempo atual. Está se verificando se a descrição inclui a palavra chuva para determinar se hoje vai chover ou não.

Conclusão

A função fetch é indispensavel no desenvolvimento web moderno. A sua capacidade de inteagir com recursos externos remotos de maneira assíncrona e eficiente tornou possivel a criação de aplicações dinêmicas e interativas que se comunicam de maneira contínua com a internet.

Ao compreender um pouco do funcionamento do fetch e sua aplicação prática., percebe-se que a sua relevância baseia-se, mas não se limita nos seguintes pontos:

1. Interação co recurso Externos;
2. Dinamismo e interatividade;
3. Consumo de APIs;
4. Atualizações em Tempo Real:
5. Integração Front-end e Back-end;
6. Desenvolvimento de Aplicativos Hibridos e Móveis;
7. Flexibilidade e Tratamento de Dados;
8. Eficiência Assíncrona;
9. Construção de Aplicações web Modernas;

Referêncais

1. Documentação do MDN Web Dos: https://developer.mozilla.org/pt-BR/docs/Web/API/Fetch_API