3

Les comento el siguiente problema:

Estoy trabajando con una API de personajes de una serie y estos están organizados de la siguiente manera: Son 34 paginas con 20 personajes cada una. Lo que hice por ahora es un bucle 'for' que me recorra la API 34 veces y me lleve todos los resultados a un array usando push (no se si esto esta bien pero fue la vuelta que le encontre).

Como cada uno de estos personajes tiene un id, un estado (vivo, muerto o desconocido), nombre, etc. estoy buscando una forma de poder filtrarlos y que solo muestre los que cumplan ciertos requisitos.

Por ejemplo poder aplicar los filtros "vivo" "episodio 1" y que llame todos los que cumplan estos requisitos.

Perdon si es mucho, pero recien estoy empezando con esto de las API y se me complica un poco el tema de filtrarlos y ordenarlos.

Desde ya, gracias.

(Por si alguno le interesa o ya la conoce es la API de rick and morty: https://rickandmortyapi.com/documentation)

Edito y agrego el codigo que estoy usando:

function llenarTodos(){
    for (i = 1; i< 34 ; i++){
        const API_URL = `https://rickandmortyapi.com/api/character/?page=${i}`
        fetch(API_URL)
        .then(response => response.json())
        .then(data => 
            todos.push(data.results))
    }
}

Con ese codigo estoy tratando de llevar a todos los personajes a un array y despues poder filtrar desde ahi

4
  • La API tienes una opcion filter donde puedes filtrar lo que necesites. Deberias agregar tu codigo para que sea mas facil ayudarte
    – alanfcm
    el 27 sep. 2021 a las 18:12
  • Ahi edite la pregunta para poder agregar el codigo de la funcion que uso para llamar a todos los personajes
    – pilki
    el 27 sep. 2021 a las 18:16
  • Si quieres tener los datos de forma local es correcto recorrer toda la API, pero no es lo ideal, ¿qué pasaría si en un futuro son 35 o 36 páginas en lugar de solo 34? Según la documentación, con este endpoint /api/character?status=alive obtendrías los personajes vivos, sin embargo no es posible filtrarlos por número de episodio a través de /characters por lo que una posible solución sería filtrar por episodio /api/episode/1 y luego consultar cada uno de los personajes que devuelve esa consulta para verificar su estatus. el 27 sep. 2021 a las 18:47
  • Ya volví a ver la información que devuelve el endpoint /api/character y para cada personaje devuelve también un array con los episodios de ocurencia. Para evitar la llamada a /api/episode, otra posible solución sería procesar la información de ese array para saber en que episodio salió, de este modo solo haces una única llamada a /api/character y de paso filtras directamente por status. el 27 sep. 2021 a las 18:52

1 respuesta 1

2

Puedes usar la funcion .filter, que es especificamente para eso, te devuelve el array filtrado, por ejemplo el siguiente codigo retornaria todos los personajes vivos en el array 'vivos':

const vivos = todos.filter((personaje) => {
        return personaje.status === 'Alive' 
    })

Basado en este ejemplo puedes expandir la funcionalidad a tus necesidades. En la funcion filter lo que esta en el return es el criterio de filtrado si quieres agregar mas condicionales a este puedes hacer cosas como por ejemplo ver si esta vivo y si su primer episodio en el que salio fue el 6:

return personaje.status=== "Alive" && personaje.episode[0] === 'https://rickandmortyapi.com/api/episode/6' 

Con estos ejemplos te puedes basar e implementar los filtros necesarios.

Aqui esta la documentacion de filter, para que le eches un ojo.

https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array/filter

3
  • Esto es una respuesta parcial puesto que solo "funcionaría" para filtrar a los personajes vivos. Lo coloco entre comillas porque en filtro correcto sería usar personaje.status === 'Alive'. La pregunta abarca también el porder filtrar por número de episodio, cosa que implicaría un poco más de trabajo. el 27 sep. 2021 a las 18:41
  • Gracias por tu comentario,edite mi respuesta en base a este. el 27 sep. 2021 a las 18:59
  • Gracias, lo pude resolver con este metodo
    – pilki
    el 27 sep. 2021 a las 21:34

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.