¿Cómo controlar resultados en JavaScript?

¿Sabes cómo puedes controlar resultados en JavaScript? Después de aprender a hacer una llamada, es necesario entender cómo controlar resultados en JavaScript de esa misma petición, pues es la forma en la que podremos recorrer los datos e información de la petición y podremos empezar a desarrollar la aplicación o plataforma web del programa de código.

Así pues, a continuación, te presentamos en qué consiste el proceso para controlar resultados en JavaScript, después de recordar cómo hacer la llamada a la API.

¿Cómo hacer una llamada a una API desde JavaScript?

Está claro que, antes de poder controlar resultados en JavaScript, debes empezar por realizar la llamada a la API o al fichero externo desde el propio fichero del lenguaje de programación. Aunque en el artículo sobre cómo hacer la llamada a una API desde JavaScript podrás verlo de forma más extensa, a continuación te mostramos el extracto de script que representa este proceso.

En resumidas cuentas, lo que verás aquí son los elementos, como XMLHttpRequest, para realizar la petición, instanciado como un elemento para cargar movimientos. A su vez, te encontrarás con el método open del objeto, donde pasaremos el tipo de método de la petición y la URL a la que le harás los request.

Después de esto, el extracto se encargará de guardar el resultado y generarlo en forma textual.

const cargaMovimientosRequest = new XMLHttpRequest()

cargaMovimientosRequest.open (‘GET’, http://localhost:500/api/v1/movimientos/, false)

cargaMovimientosRequest.send()

movimientos = cargaMovimientosRequest.responseText

Ahora que recuerdas cómo hacer una llamada a una API desde este lenguaje de programación, ya podemos empezar a explicarte cómo controlar los resultados en JavaScript.

¿Cómo controlar resultados en JavaScript?

La acción de controlar los resultados de JavaScript está especificada como un proceso para recorrer cada uno de los datos que hemos obtenido después de la llamada. Ahora bien, en el caso particular de este ejemplo práctico, nos encargamos de generar una aplicación web que registre ingresos y gastos de una cuenta.

En este caso, para cada movimiento, vamos a recorrer los datos, insertar una fila y agregar un dato por cada celda. Asimismo, tendrás que insertar una fila como última fila de una tabla.

Pasos para controlar los resultados

Para empezar, vamos a establecer un objeto o const al que llamaremos cuerpoTabla. La tabla de movimientos de la app que registre ingresos y gastos son los resultados obtenidos a partir de la llamada realizada por JavaScript. Por eso, una vez establecido el objeto, vamos a pasarlo un método para obtener los datos de la tabla: document.getElementById.

Ahora, para insertar la fila y realizar los pasos para recorrer los resultados, vamos a empezar a crear una que esté completamente vacía con el método let htmlFilas. Después, pasaremos por la primera fila de la tabla, que recogerá el movimiento o los movimientos.

Luego, generará una cadena, que se encuentra dentro de las etiquetas <tr> </tr>. A continuación, la concatenará, es decir, la pondrá detrás de la anterior fila o htmlFilas.

Cada vez que el programa vuelva a realizar este recorrido, concatenará otra fila. Cuando acabe, tendrá el HTML de todas las filas de la tabla.

Script para controlar resultados

A continuación, te mostramos cómo luciría el script para controlar los resultados que se han obtenido por la llamada:

const cuerpoTabla = document.getElementById (‘cuerpo – tabla’)

let htmlFilas = ‘ ‘

for (let 1 = 0; 1 < movimientos.length; i++) {

mov = movimientos [i]

htmlFilas = htmFilas + ‘

<tr>

<td> S {mov.fecha} </td>

<td> S {mov.hora} </td>
<td class = “text – left”> S {mov.concepto} </td>
<td> S {mov.ingreso_gasto} </td>

<td class = “text – left”> S {mov.cantidad} </td>

</tr>

cuerpoTabla.innerHTML = htmlFilas

Recuerda que esta es solo una representación inicial de lo que puede realizarse cuando estás controlando los resultados de una petición.

Ahora que sabes cómo controlar resultados en JavaScript que han sido obtenidos a partir de la llamada hacia a la API, estás más cerca de convertirte en un programador experto. Aunque sabemos que el camino puede parecer un poco largo, es satisfactorio y, además, puede ser acelerado con un bootcamp que te guíe por todas las bases y fundamentos. Por eso, te queremos recomendar Aprende a Programar desde Cero Full Stack Jr. Bootcamp, pues afianza tus habilidades y conocimientos. ¡Anímate y sigue aprendiendo!