Las clases son un elemento relativamente nuevo en JavaScript, pues fueron introducidas en ECMAScript 2015. Sin embargo, desde que se introdujeron a este lenguaje de programación han sido muy útiles para crear moldes de propiedades. A pesar de su gran utilidad, esto nos puede causar confusiones en proyectos a gran escala. Por ello, en este post, te enseñaremos una estrategia para decidir qué clase insertar en JavaScript de manera clara y rápida.
¿Por qué se debe decidir qué clase insertar en JavaScript?
Como has podido leer en nuestros posts sobre clases y herencia en JavaScript, estos dos conceptos se relacionan fuertemente. La herencia en este lenguaje de programación, al igual que la herencia en la vida real, se basa en que una clase puede heredar propiedades de otra clase. Cuando sucede esto, definimos que la clase de la cual se heredan propiedades es una clase padre. Entonces, la clase que hereda dichas propiedades se llamará clase hija.
Bajo este contexto, utilizaremos las clases padre e hija para ejecutar muchas acciones. Por ello, necesitaremos decidir qué clase insertar en JavaScript para ejecutar cada acción. Es decir, deberemos hacer que una de las clases sea responsable de cada acción. Esta decisión se basará en la jerarquía de las clases y su habilidad de heredar propiedades de otra o hacia otra.
A continuación, te enseñamos una estrategia para decidir qué clase insertar en JavaScript.
¿Cómo decidir qué clase insertar en JavaScript?
A la hora de crear funciones con clases, puede que nos encontremos en un escenario en el que no sabemos qué clase será la responsable de ejecutar una acción. En estos momentos, normalmente dudamos entre la clase padre y la clase hija. Gracias a la herencia de JavaScript, si hacemos que el padre sea el responsable, el hijo automáticamente tendrá esta propiedad. Sin embargo, puede que la acción sea específica para la clase hija, por lo que debería pertenecer a esta.
Cuando te encuentres en este tipo de escenarios, te recomendamos pensar en la posibilidad de que haya otro hijo. Entonces, pensarás en las propiedades que quieres que tenga este nuevo elemento y si es lógico que tenga o no la acción que estás pensando ejecutar. Si la respuesta es sí, la acción debería pertenecer al padre.
Te ponemos un ejemplo. Piensa que estás creando una acción con la que harás que se juegue un partido. Dentro de tu proyecto, tienes una clase padre League, con dos clases hijas: una clase FootballLeague y una clase BasketLeague. Entonces, podrás pensar si “jugar un partido” es una acción que deberían tener ambos hermanos o si es particular a uno de ellos. Nosotros opinamos que es una acción importante para ambas clases hijo, por lo que haríamos responsable de la acción a la clase padre League. Cuando hacemos esto, definimos que la acción estará disponible para todos sus hijos.
Ahora, pensemos en un ejemplo en el que el padre no debería ser el responsable. Dentro del mismo proyecto de League, FootballLeague y BasketLeague, queremos crear una función que otorgue a cada equipo los puntos que merece por cada partido ganado, empatado o perdido. El valor asignado a cada situación seguirá las normas deportivas del fútbol. Es decir, un partido ganado será igual a tres puntos, un partido empatado será igual a un punto y un partido perdido será igual a cero puntos.
Entonces, ¿qué haremos para decidir qué clase insertar en JavaScript en esta situación? ¡Exactamente lo mismo! Piensa en la clase hija BasketLeague, ¿debería tener una acción basada en los puntos de fútbol? Ya que la respuesta es no, haremos que la clase FootballLeague sea la responsable de la acción. De este modo, no afectaremos la lógica interna de su clase hermana.
Si todavía tienes dudas sobre el concepto de herencia en JavaScript y cómo afecta la ejecución de distintas acciones, te invitamos a leer el post de Mozilla Developer Network sobre herencia.
¿Cuál es el siguiente paso?
Después de leer este post no solo has aprendido a decidir qué clase insertar en JavaScript, sino que también has dado un paso más en tu camino donde ser un experto del desarrollo web es la meta. Ahora, para llegar a este objetivo, el siguiente paso es asegurarte de aprender la teoría y la práctica de mano de profesionales para sacarle el máximo partido a tu formación. Para ello, te recomendamos nuestro bootcamp intensivo de Desarrrollo Web Full Stack Bootcamp, donde nuestros profesores expertos te enseñarán a dominar lenguajes de programación como CSS, HTML y JavaScript. ¿A qué esperas para dar este paso? ¡Matricúlate ahora!
