Para seguir aprendiendo con ejercicios prácticos, te recomendamos conocer el proceso para definir la función mostrar movimientos con JavaScript. En este ejemplo práctico, nos encargamos de desarrollar una aplicación que registra ingresos y gastos de una cuenta o base de datos. Así pues, a continuación, te comentamos cómo definir una función mostrar movimientos con JavaScript.
Cómo definir la función mostrar movimientos con JavaScript
A continuación, te traemos una representación, en forma de código, de cómo luciría el extracto de código acerca del desarrollo de la función mostrar movimientos en JavaScript.
Ten en cuenta que esta debe estar acompañada por otras funciones que las anteceden y preceden. Algunas de estas son: recargar movimiento y obtener movimiento. Todas estas dentro de un programa de código que está pensando en desarrollar una app que registra los ingresos y los gastos de una cuenta desde una base de datos.
#definición de la función
Function mostrarMovimientos() {
If (this.readyState == 4 && this.status == 200) {
Console.log (‘Inicio pintado de movimientos’=
🔴 ¿Quieres Aprender a Programar con Python? 🔴
Descubre el Full Stack Jr. Bootcamp - Aprende a Programar desde Cero de KeepCoding. La formación más completa del mercado y con empleabilidad garantizada
👉 Prueba gratis el Bootcamp Aprende a Programar desde Cero por una semanaRespuesta = Json.parse (cargaMovimientosRequest.responseText)
Movimientos = respuesta.results
let htmlFilas = ‘’
for (let i = 0; i < movimientos.length; I++) {
mov = movimientos [i]
if (!mov.hora) {
mov.hora = “–:–;
}
If (mov.ingreso_gasto == ‘G’) {
Mov.ingreso_gasto = ‘Gasto’
} else {
Mov.ingreso_gasto = ‘Ingreso’
}
htmlFilas = htmlFilas + ‘
<tr>
<td> $ {mov.fecha} </td>
<td> $ {mov.hora} </td>
<td class = “text – left”> $ {mov.concepto} </td>
<td> $ {mov.ingreso_gasto} </td>
<td class = “text-right”> $ {mov.cantidad} </td>
</tr>
cuerpoTabla.innerHTML = htmlFilas
}
} else {
Alert (´Error al cargar los movimientos´)
console.log (‘Fin pintado movimientos’)
Síntesis sobre la definición de la función mostrar movimientos con JavaScript
En términos generales, en este proceso se han utilizado varios métodos inherentes a la programación con el lenguaje JavaScript, pues es este el que se encarga de generar la parte de animación e interactividad de la aplicación con el usuario del programa.
En este caso, estamos generando esta función con una condición, de modo que se ejecute de una forma específica cuando una variable resulte en verdades. Pero si, por el contrario, no se cumple dicha variable o condición, se decide optar por otro camino, donde hay un mensaje esperando.
Así pues, vemos que en este caso la condición dada por if quiere comprobar un status code de una petición, pues se utiliza el método this.readyState, con el estado 4. Este quiere decir que todo ha sido aprobado y hay acceso a la llamada. De esta manera, se le avisa al usuario con un console.log de que se está ejecutando la acción.
Después de esto, se establece la forma en la que se representarán las respuestas
En ese instante es cuando empiezan a correr los movimientos y a aparecer en la ventana de la aplicación. Como te contamos hace un momento, para que se pinten los movimientos deberás registrar una serie de acciones con etiquetas de tipo HTML, con un método que vaya agregando cada uno de lo registros después de completarlo.
Está claro que aquí deberás establecer diferentes valores que aparecerán en las ventanas de la plataforma; estos dirán mucho acerca del punto del proceso en el que se encuentran, así como los errores con los que podemos encontrarnos. Para ello, podrás utilizar dos métodos: console.log y Alert, inherentes de JavaScript.
Recuerda que esta es una función que está relacionada con el desarrollo de otras, tal como ObtenerMovimientos y Recargar Movimientos.
¿Qué puedes hacer ahora?
Ahora que ya sabes cómo definir la función mostrar movimientos con JavaScript, estás más cerca de construir los objetos animados del programa de código que desarrollará una aplicación que registra ingresos y gastos.
Ahora, si quieres seguir aprendiendo sobre programación y el sector IT, te recomendamos visitar el programa del Aprende a Programar desde Cero Full Stack Jr. Bootcamp de KeepCoding. Es una gran oportunidad para perfeccionar tus habilidades y aumentar tus conocimientos. ¡Anímate y sigue aprendiendo!
