¿Te has preguntado cómo programar un partido de fútbol en JavaScript? Si es así, haz llegado al lugar indicado.
Todo proyecto de programación se basa en la escritura de acciones que manipulan los elementos creados. Para ejecutar dichas acciones, utilizamos distintos aspectos de la sintaxis de cada lenguaje de programación como operadores, variables y funciones. En este post, practicaremos la ejecución de acciones y te enseñaremos cómo programar partidos de fútbol en JavaScript utilizando una variedad de elementos de su sintaxis.
¿Cómo programar un partido de fútbol en JavaScript?
Para programar un partido de fútbol en JavaScript, crearemos una función que contenga distintas variables y llame a distintas funciones. A esta función la llamaremos play. Dentro de su parámetro, pasaremos el objeto match, que dentro contiene dos propiedades: home y away. Estas propiedades se llenan con los distintos equipos de una liga para representar los equipos visitantes y locales de cada partido.
Te recomendamos leer nuestro post sobre pasar un objeto como parámetro en JavaScript para entender mejor estos pasos.
¿Cómo programar partidos de fútbol con JavaScript?
Entonces, lo primero que hacemos para programar un partido de fútbol en JavaScript es otorgarle dos variables a la función play. Una de estas variables es para definir los goles del equipo local y otra para definir los goles del equipo visitante.
play (match) {
const homeGoals = this.generateGoals ( );
const awayGoals = this.generateGoals ( );
}
Como ves, hemos igualado estas dos variables a la función generateGoals que vamos a crear. Observa que hemos llamado a esta función utilizando la palabra clave this, que nos ayuda a llamar a una propiedad del objeto que estamos editando.
La función generateGoals nos devolverá un número aleatorio de 0 a 9. Esto nos ayudará a determinar aleatoriamente el resultado del partido. Para crear esta acción, utilizaremos el objeto math de JavaScript y su método random. Además, insertaremos la operación que creemos con el método Math.random dentro del método Math.floor, que nos permite obtener como resultado solamente números enteros.
generateGoals ( ) {
return Math.floor (Math.random ( ) * 10);
}
Ten presente que hemos podido crear la función generateGoals después de haberla llamado en la función play, porque el orden en el que insertamos funciones en JavaScript no importa cuando lo hacemos dentro de una clase. Sin embargo, el orden de nuestro código sí importa en otras ocasiones, como cuando utilizamos una asignación. Para conocer más sobre este tema, te invitamos a leer nuestro artículo sobre el orden para escribir funciones en JavaScript.
Ahora que hemos creado la función generateGoals para generar el resulado de nuestro partido, debemos darle algo que devolver a la función play. ¿Y qué hay que devolver a la hora de programar partidos de fútbol en JavaScript? Pues los valores de las propiedades que definen los goles. Para ello, podemos insertar un array que incluya dentro las variables homeGoals y awayGoals. Sin embargo, te recomendamos utilizar un objeto literal en vez de un array, pues estos nos permiten estructurar datos de una manera más sencilla.
Entonces, la función final para programar un partido de fútbol en JavaScript será la siguiente:
play (match) {
const homeGoals = this.generateGoals ( );
const awayGoals = this.generateGoals ( );
return {
homeTeamName: match.home,
homeGoals: homeGoals,
awayTeamName: match.away,
awayGoals: awayGoals,
}
Una forma de simplificar esta función es utilizar el shorthand de objeto literal, introducido en la segunda revisión más importante de la sintaxis de JavaScript: ECMAScript 2015. Gracias a ella, basta con utilizar el nombre de las variables definidas anteriormente para insertarlas como propiedades de un objeto literal. En este caso, estas propiedades son homeGoals y awayGoals. Entonces, usando este shorthand, la función play se vería de la siguiente manera:
play (match) {
const homeGoals = this.generateGoals ( );
const awayGoals = this.generateGoals ( );
return {
homeTeamName: match.home,
homeGoals,
awayTeamName: match.away,
awayGoals,
}
Ahora que sabes cómo programar un partido de fútbol en JavaScript usando los conocimientos teóricos que has aprendido antes, te invitamos a seguir aprendiendo y practicando en nuestro Desarrollo Web Full Stack Bootcamp. En esta formación intensiva, además de aprender a dominar JavaScript, te formarás en otros lenguajes de programación, como CSS y HTML. ¿Te animas a inscribirte para convertirte en profesional? ¡Hazlo ya y destaca en el sector IT!
