En el mundo de la programación, existen muchos momentos en los que necesitaremos crear una matriz de datos. Entre estas, una matriz de datos muy común es una planificación. Por ello, en este post, te enseñaremos cómo crear una planificación con JavaScript basada en una matriz.
¿Qué haremos en este post?
Para ayudarte a entender cómo crear una planificación con JavaScript, ejemplificaremos la creación de esta matriz con la planificación de una liga deportiva. Por lo tanto, lo que haremos será crear una planificación en la que veamos los equipos que disputan en cada partido y los partidos que conforman cada jornada. Actualmente, nuestro código se encuentra en el estado en el que lo hemos dejado en nuestro post sobre crear un directorio de clases en JavaScript.
¿Cómo crear una planificación con JavaScript?
Antes de empezar a crear cualquier elemento nuevo en tu proyecto, te sugerimos pensar en qué módulo situarlo. Tener esto claro te ahorrará tener que pasarlo a un nuevo archivo en el futuro y te permitirá mantener tu archivo index.js organizado. Si tienes dudas sobre este tema, te invitamos a consultar nuestros posts sobre cómo cargar un módulo en JavaScript y cómo crear un directorio de clases usando estos módulos.
Ahora, para crear una planificación con JavaScript es bueno definir los elementos que la conformarán. En nuestro caso, hemos definido que una planificación de liga es un conjunto de jornadas, que a su vez es un conjunto de partidos. Dentro de cada partido, habrá un equipo local y un visitante. Con esta información definida, es el momento de pensar qué variables utilizaremos para representar esta información.
Nosotros hemos elegido representar la planificación con un array, pues es un conjunto de elementos; lo mismo hemos hecho para las jornadas. Para los partidos, hemos decidido representarlos usando un objeto, pues esto nos permitirá crear dos clave-valor, una para el visitante y otra para el local.
A continuación, te mostramos esta representación:
planificación = [j1, j2, j3, j4,...]
jornada = [p1, p2, p3, p4,...]
partido = {local: 'local', visitante: 'visitante'}Ahora, para hacer que estos elementos creen una planificación, podemos crear una matriz. Recuerda que una matriz es un esquema con dos variables. Entonces, podemos crear una especie de tabla en donde tengamos las jornadas por un lado y los partidos por el otro. Para poder dibujar una matriz, debemos insertar un bucle dentro de otro, pues uno organizará la variable en el lado vertical y otro en el lado horizontal. Esto lo hemos usado para crear nuestro tablero de ajedrez en JavaScript.
Entonces, usaremos dos bucles for, uno en una dirección y el otro en la otra. Uno de ellos lo definiremos según el número de partidos que se deben jugar por jornada y el otro según el número de jornadas. Ten presente que, en este proyecto, estamos intentando crear un sistema de todos contra todos que se refleja en los números de nuestra planificación.
Asumiendo que tenemos un array con los elementos ‘A’, ‘B’, ‘C’ y ‘D’ llamado teams, creamos la siguiente función:
scheduleMatchDays () {
const numberOfMatchDays = this.teams.lenght - 1; //número de jornadas
const numberOfMatchesPerDay = this.teams.lenght / 2; //número de partidos por jornada
for (let i = 0; i < numberOfMatchDays; i++) {
console.log ('matchDay' ${i}')
for (let j = 0; j < numberOfMatchesPerDay; j++) {
let match = {home: 'home', away: 'away')
console.log (match)Como puedes ver, dentro de la función scheduleMatchDays hemos insertado todos los elementos requeridos para nuestra planificación. Con la constante numberOfMatchDays, definimos el número de jornadas, que luego recorremos con el primer bucle for. Luego, hemos definido la constante numberOfMatchesPerDay que recorremos con el segundo bucle.
Recuerda que la manera de crear este bucle es insertar el operador aritmético ++, que hace que nuestro valor crezca por una unidad en cada iteración. Con el operador < hemos definido en qué punto debe detenerse cada bucle.
Finalmente, hemos insertado una variable let con el objeto match, que nos ayudará a insertar en cada partido las variables home y away. Por ahora no haremos nada con estas variables, pero más adelante podríamos definir qué equipo toma cada rol.
Ahora que has podido crear una planificación con JavaScript, es el momento de definir desde dónde llamamos esta función. Ya que es una función tan importante, la llamaremos desde nuestro archivo index.js. Entonces, podemos utilizar la nueva función para crear la planificación de nuestra liga de fútbol. Para ello, basta con insertar lo siguiente:
footballLeague.scheduleMatchDays ();El resultado de nuestra función será el siguiente. Aunque te lo ejemplificamos con solo dos jornadas, este bucle se repetirá hasta que llegue al valor this.teams.lenght – 1. Ya que nuestro array de equipos tiene solo cuatro elementos, tendríamos tres jornadas en total:
matchDay 0
{home: 'home', away; 'away'}
{home: 'home', away; 'away'}
matchDay 1
{home: 'home', away; 'away'}
{home: 'home', away; 'away'}Ahora que sabes cómo crear una planificación con JavaScript, te recomendamos poner en práctica estos nuevos conocimientos para crear tus propias matrices. Para ayudarte en tu proceso para dominar JavaScript, puedes unirte a nuestro Desarrollo Web Full Stack Bootcamp. Allí, además de aprender a dominar este y otros lenguajes de programación, crearás tus propios proyectos con ayuda de nuestros profesores. ¡No dudes más en unirte! ¡Te esperamos!
