User Tools

Site Tools


es:web_development:tables:javascript

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
es:web_development:tables:javascript [2022/03/17 06:47]
mag [Matrices Multidimensionales]
es:web_development:tables:javascript [2023/08/16 09:33] (current)
Line 131: Line 131:
   * En este punto, la función no sabe qué playeres y el código principal no tendrá acceso a statsRow.   * En este punto, la función no sabe qué playeres y el código principal no tendrá acceso a statsRow.
   * Agregue playerbetween ()para decirle al código original que necesitamos esta información.   * Agregue playerbetween ()para decirle al código original que necesitamos esta información.
-  * Agregue una nueva línea al final con return statsRow;para devolver la cadena al código principal. Ahora debería verse así.+  * Agregue una nueva línea al final con <html>return statsRow;</html> para devolver la cadena al código principal. Ahora debería verse así.
 <code>function crearTextoFila(jugador) { <code>function crearTextoFila(jugador) {
     statsRow = "<tr>";     statsRow = "<tr>";
Line 156: Line 156:
   * Entonces estamos diciendo que tenemos una matriz de matrices (lista de listas) llamada <html>jugadores</html>.   * Entonces estamos diciendo que tenemos una matriz de matrices (lista de listas) llamada <html>jugadores</html>.
   * Queremos mostrar a cada jugador por turno, por lo que necesitamos datos de 'jugadores[0]', 'jugadores[1]', 'jugadores[2] y 'jugadores[3]'. En lugar de escribir cada uno de estos a su vez, podemos usar un bucle javascript de la siguiente manera.   * Queremos mostrar a cada jugador por turno, por lo que necesitamos datos de 'jugadores[0]', 'jugadores[1]', 'jugadores[2] y 'jugadores[3]'. En lugar de escribir cada uno de estos a su vez, podemos usar un bucle javascript de la siguiente manera.
-<code>// crear texto+<code>    // crear texto
     for (j = 0; j <jugadores.length; j++) {     for (j = 0; j <jugadores.length; j++) {
  
Line 173: Line 173:
   * Ya tenemos una función que hace esto, así que llamémosla.   * Ya tenemos una función que hace esto, así que llamémosla.
 <code>        // crea texto de fila <code>        // crea texto de fila
-        statsRow = createRowText(jugadores[j]);</code>+        statsRow = crearTextoFila(jugadores[j]);</code>
   * Mantuvimos el nombre de la variable 'statsRow' porque se ajusta a nuestro código para agregar a la tabla, pero esta es una variable diferente a la que está dentro de la función. El que está dentro de la función solo funciona dentro de la función (su 'alcance' es la función).   * Mantuvimos el nombre de la variable 'statsRow' porque se ajusta a nuestro código para agregar a la tabla, pero esta es una variable diferente a la que está dentro de la función. El que está dentro de la función solo funciona dentro de la función (su 'alcance' es la función).
   * <html>createRowText(jugadores[j])</html> llama a la función 'createRowText' y le proporciona los datos pertenecientes al jugador actual como vimos en la Consola.   * <html>createRowText(jugadores[j])</html> llama a la función 'createRowText' y le proporciona los datos pertenecientes al jugador actual como vimos en la Consola.
Line 229: Line 229:
   * Esto parece mucho más eficiente ahora, pero aún puede pensar que es más fácil crear la tabla en HTML que en Javascript. Está bien. ¿Qué tal si usamos el equipo completo? ¿Te imaginas armar la mesa con 26 jugadores? ¿Qué sucede si está utilizando datos con miles de entradas? Crear la matriz es mucho más fácil.   * Esto parece mucho más eficiente ahora, pero aún puede pensar que es más fácil crear la tabla en HTML que en Javascript. Está bien. ¿Qué tal si usamos el equipo completo? ¿Te imaginas armar la mesa con 26 jugadores? ¿Qué sucede si está utilizando datos con miles de entradas? Crear la matriz es mucho más fácil.
  
-[[es:web_development:tables:exercises|Siguiente: Ejercicio]] +==== Final Code ==== 
 +  * [[https://techschool.murraygunn.id.au/webdev/classes/proyecto/2/es.html.php|equipo.html]] 
 +  * [[https://techschool.murraygunn.id.au/webdev/classes/proyecto/2/style.php|style.css]] 
 +  * [[https://techschool.murraygunn.id.au/webdev/classes/proyecto/2/es.js.php|equipo.js]] 
 +  * [[https://techschool.murraygunn.id.au/webdev/classes/proyecto/2/equipo.html|resultado]] 
 + 
 +[[es:web_development:tables:exercise|Siguiente: Ejercicios]] 
  
es/web_development/tables/javascript.1647524835.txt.gz · Last modified: 2023/08/16 09:33 (external edit)