Scribd
Cargar
32 vistas12 páginas

Ejemplo de uso de Fetch en JavaScript

La instrucción fetch en JavaScript se utiliza para realizar solicitudes HTTP de forma asíncrona y obtener recursos. Fetch toma una URL, devuelve una representación de la respuesta y permite encadenar funciones then, catch y finally para manejar la respuesta, errores y limpieza final. Un ejemplo consume la API de Rick y Morty y construye tarjetas con los datos obtenidos.

Cargado por

Brayan Quintero
Derechos de autor
© All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
32 vistas12 páginas

Ejemplo de uso de Fetch en JavaScript

La instrucción fetch en JavaScript se utiliza para realizar solicitudes HTTP de forma asíncrona y obtener recursos. Fetch toma una URL, devuelve una representación de la respuesta y permite encadenar funciones then, catch y finally para manejar la respuesta, errores y limpieza final. Un ejemplo consume la API de Rick y Morty y construye tarjetas con los datos obtenidos.

Cargado por

Brayan Quintero
Derechos de autor
© All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd

JAVASCRIPT

FETCH API

Trainer
Ing. Carlos H. Rueda C.
JAVASCRIPT La instrucción "fetch" en JavaScript es una
función incorporada que se utiliza para
FETCH realizar solicitudes de red y recuperar
recursos de forma asíncrona. Se utiliza
principalmente para realizar solicitudes
HTTP a servidores web y obtener
respuestas en formato JSON, HTML, texto u
otros formatos.
JAVASCRIPT La sintaxis básica es:
SINTAXIS fetch(url)
.then(response => [Link]())
.then(data => {
// Hacer algo con los datos
})
.catch(error => {
// Manejar el error
})
.finally(() => {
// bloque para hacer ya sea que
ocurrra o no un error.
});
JAVASCRIPT fetch(url)
SINTAXIS
1. Se llama a la función fetch pasando la
URL del recurso que se desea recuperar.
Esto devuelve una representación de la
respuesta HTTP recibida.
JAVASCRIPT .then(response => [Link]())
SINTAXIS
2. se encadena una serie de llamadas a los
métodos then(), que se ejecutan cuando
se resuelve correctamente. En el primer
then(), se llama al método json() en el
objeto response para analizar la
respuesta HTTP y obtener los datos en
formato JSON.
JAVASCRIPT .then(data => {
// Hacer algo con los datos
SINTAXIS })

3. En el segundo then(), se puede acceder a


los datos recuperados y realizar las
acciones necesarias en función de ellos.
JAVASCRIPT .catch(error => {
// Manejar el error
SINTAXIS })

4. Si ocurre algún error durante el proceso


de recuperación de datos, se captura
mediante el método catch(), que maneja
el error.
JAVASCRIPT .finally (() => {
// Manejar el error
SINTAXIS })

5. bloque de código que se ejecutará al final


ya sea que ocurra o no ocurra un error.
JAVASCRIPT fetch("[Link]
.then(result => [Link]())
SINTAXIS .then(datos => {
// [Link](datos);
construirTarjeta(datos);
})
.catch((err) => {
[Link]("Error al consumir la API\n",
Ejemplo [Link])
} )
.finally(() => {
[Link]("Se ha consumido todo el API");
})
Use la siguiente API para simular una batalla entre
2 pokemones.
▪ API: [Link]
JAVASCRIPT ▪ Id_poke: número entero entre 1 y 150
▪ Revise el JSON de respuesta y tome los datos que le
SINTAXIS sirvan para el propósito deseado

Ejercicio 1
Trainer
Ing. Carlos H. Rueda C.

También podría gustarte