Las clases en JavaScript nos permiten determinar un molde de propiedades con el que podemos crear muchos objetos. Aunque los objetos derivados de estas clases serán iguales, se pueden diferenciar añadiendo propiedades únicas a cada uno. En este post, te enseñaremos cómo usar el método setup para particularizar clases en JavaScript.
¿Qué es el método setup para particularizar clases en JavaScript?
En nuestro post sobre cómo simplificar el constructor de JavaScript te hemos enseñado cómo usar el método setup para reducir el número de asignaciones que escribimos dentro de nuestras clases. Este método nos permite insertar las asignaciones que hemos hecho con nuestro objeto config dentro de un método llamado setup, al cual llamamos dentro de nuestra clase.
La ventaja principal de este método, además de simplificar nuestro código, es poder definir valores por defecto en nuestras propiedades. Gracias al método object.assign de JavaScript, podemos hacer que estos valores cambien según las necesidades particulares de cada objeto, pues este método nos permite combinar las propiedades de uno o más objetos y elegir qué valor de las propiedades repetidas tiene prioridad.
A continuación, te enseñamos cómo usar el método setup para particularizar una clase con más asignaciones.
¿Para qué funciona el método setup?
Para ejemplificar cómo se utiliza el método setup para particularizar clases en JavaScript, utilizaremos la clase FootballLeague que definimos en nuestro post sobre cómo pasar un objeto como parámetro. Antes de utilizar nuestro método, esta clase se ve de la siguiente manera:
class FootballLeague extends League {
constructor (name, teams, config= { }) {
super (name, team, config)
this.pointsPerWin = config.pointsPerWin;
this.pointsPerDraw = config.pointsPerDraw;
this.pointsPerLose= config.pointsPerLose;
}
}
Recuerda que en este momento estamos utilizando el objeto config como parámetro para reducir el número de variables que insertamos dentro del paréntesis de constructor. Este objeto de configuración actualmente tiene los siguientes parámetros:
const footballLeagueConfig = {
pointsPerWin: 3,
pointsPerDraw: 1,
pointsPerLose: 0,
}
La manera de llamar a este objeto cuando ejecutemos nuestro código es pasarlo como parámetro, junto al nombre de la liga y los equipos:
let footballLeague = new footballLeague (‘foot’, teams, footballLeagueConfig)
console.log (footballLeague)
Como hemos visto, esta forma de parametrizar nuestras clases funciona. Sin embargo, este elige describir los nuevos parámetros de manera explícita en cada clase, incluso si son el mismo valor. Con el método setup podemos definir unos valores default que se repliquen en todas las clases, a menos que escribamos un nuevo valor que tendrá prioridad sobre este. Esto nos permite encontrar un punto medio entre usar el molde de clase y tener clases flexibles.
¿Cómo utilizamos el método setup?
Con base a las clases y objetos anteriores, lo que haremos ahora será pasar los valores que queremos para los puntos de empate, ganar y perder al método setup. A continuación, te mostramos cómo se ve esto:
setup (config = { }) {
const defaultConfig = {
rounds: 1,
pointsPerWin: 3,
pointsPerDraw: 1,
pointsPerLose: 0,
}
}
Ahora que tenemos nuestro método setup, podemos crear la línea de código que nos permitirá parametrizar las clases de JavaScript. Esta línea de código la insertamos dentro del método, justo después del primer cierre de llave:
this.config = object.assign (defaultConfig, config)
Con esta línea estamos diciendo que los parámetros del método setup se combinarán con los parámetros del objeto de configuración que creemos para nuestras clases hijas o nuestros objetos derivados. Si existen parámetros que tengan la misma variable, el método object.assign tomará el valor del objeto de configuración sobre los valores de nuestro defaultConfig.
Ten presente que, aunque crees varios métodos setup para tus clases padre y clases derivadas, a la hora de instanciar tu nuevo objeto con una clase, el programa seguirá los parámetros setup de la clase instanciada. Entonces, cuando ejecutamos nuestro código para crear un objeto de la clase footballLeague, el método setup a seguir no será el de League, sino el de la clase instanciada.
Esperamos que este post te haya servido para pensar en nuevas formas de ordenar y utilizar las clases en JavaScript. Si tienes dudas acerca de alguno de los conceptos que hemos descrito, te recomendamos consultarlos en la sección de nuestro blog sobre desarrollo web o en la página oficial de Mozilla Developer Network sobre JavaScript.
¿Cuál es el siguiente paso?
Después de leer este post, sabes exactamente cómo utilizar el método setup para particularizar clases en JavaScript. Ahora, el siguiente paso en tu camino para dominar este lenguaje de programación es practicar lo aprendido. Para ello, te recomendamos Desarrollo Web Full Stack Bootcamp, una combinación ideal entre teoría y práctica donde aprenderás todo lo necesario para desarrollar con lenguajes de programación para la web como JavaScript, CSS y HTML. ¿A qué esperas para cumplir tu sueño de ser un desarrollador web? ¡Te esperamos!
