Clases en Typescript
¡Hola a todos! En este blogpost, trataré de explicar los fundamentos de las clases en TypeScript, incluyendo cómo utilizar herencia, getters y setters, y las palabras clave public, private y protected.
Pensemos en las clases como un plano de un objeto. En JavaScript, tenemos una estructura llamada objeto a partir de la cual podemos crear instancias con información almacenada. Pero, ¿qué sucede si queremos tener múltiples veces el mismo objeto, con los mismos métodos y atributos? En JavaScript, podemos asignar a una variable una instancia de una clase. Podemos pensar en algo como:
const person = new Person(personObject)
En donde “personObject” es la estructura con información que usaremos para modelar. Person es la clase. y person es la instancia de la clase Person con informacion de personObject.
En pocas palabras: Los objetos son las cosas concretas con las que trabajamos en nuestro codigo. Las clases nos permiten definir como deben verse los objetos. Que datos/atributos/metodos deben contener
El keyword this
El keyword “this” dentro de una clase, se refiere a la instancia que se esta creando. Si creamos un objeto nuevo y le definimos a un atributo, un método de la clase que le pertenece a otra instancia y este método, utiliza un atributo del objeto, nos va a lanzar un undefined, en caso de que en este nuevo objeto, no este definido el atributo que se utiliza en el método de la instancia.
Dentro de una clase en TypeScript, el keyword "this" se refiere a la instancia que se está creando. Esto significa que cualquier referencia a "this" dentro de los métodos o propiedades de la clase se refiere a la instancia actual.
Por ejemplo, si creamos un nuevo objeto y le definimos un atributo que pertenece a otra instancia de la misma clase, y luego intentamos utilizar un método que depende de ese atributo, se producirá un error "undefined" si el atributo no ha sido definido en el nuevo objeto.
En resumen, "this" en las clases de TypeScript se refiere a la instancia actual y es esencial para hacer referencia a los atributos y métodos de la clase. Con un buen entendimiento de su uso, puedes aprovechar al máximo las capacidades de TypeScript y crear código más robusto y escalable.
Ejemplo de una clase
class Person {
// el constructor se va a ejecutar siempre que se cree una nueva instancia.
constructor(personObject) {
this.name = personObject.name
this.lastName = personObject.lastName
this.greet =
}
greet() {
console.log(`Hola mi nombre es ${this.name} ${this.lastName}`)
}
}
const personObject = {
name: 'Jose',
lastName: 'Guardiola'
}
const person = new Person(personObject);
console.log('greet', person.greet()) // Hola mi nombre es Jose Guardiola
Inheritance/Herencia
En TypeScript, una clase puede heredar métodos y propiedades de otra clase utilizando el keyword "extends" al momento de crear una nueva clase.
Al heredar de una clase padre, la nueva clase tendrá acceso a todas las propiedades y métodos definidos en la clase padre.
Es importante tener en cuenta que, al heredar de una clase, es necesario utilizar el keyword "super" dentro del constructor de la nueva clase. Esto permitirá inicializar el constructor de la clase padre durante la inicialización de la nueva clase. Es crucial que "super" se ejecute antes que cualquier otra cosa dentro del constructor de la nueva clase.
Además, la clase hijo también puede sobrescribir métodos o propiedades de la clase padre si es necesario, para adaptarlos a sus propias necesidades.
Ejemplo
class Mexican extends Person {
// el constructor se va a ejecutar siempre que se cree una nueva instancia.
constructor(mexicanObject) {
super(mexicanObject)
this.curp = mexicanObject.curp
}
curpMessage() {
console.log(`El curp de ${name} ${lastName} es: ${curp}`)
}
}
const mexicanObject = {
name: 'Jose',
lastName: 'Guardiola'
curp: 'GUAA1920DJEID'
}
const mexican = new Mexican(mexicanObject);
console.log('greet', mexican.curp()) // El curp de Jose Guardiola es GUAA1920DJEID
Keywords dentro de una clase.
En las clases de TypeScript, se pueden utilizar palabras clave para definir mejor las propiedades de la clase. Las palabras clave más comunes son "public", "private" y "protected".
Por defecto, las propiedades se definen como "public". Esto significa que se pueden acceder y modificar desde cualquier parte del código.
Si se asigna la palabra clave "private" a una propiedad, sólo se puede acceder y modificar dentro de la clase. Esto ayuda a proteger la propiedad de ser modificada accidentalmente desde otras partes del código.
Por otro lado, si se utiliza la palabra clave "protected", la propiedad sólo puede ser accedida y modificada dentro de la clase y en cualquier clase hija que herede de ella.
Es importante destacar que la palabra clave "private" sólo está disponible en TypeScript. En JavaScript "vanilla", se puede utilizar el símbolo "#" antes del nombre de la propiedad o método para marcarlos como privados.
Getters y setters
Los getters y setters son funciones que se ejecutan dentro de la clase, pero que se pueden acceder desde el exterior como si fueran propiedades.
Al utilizar el método "set", se puede asignar un nuevo valor a una propiedad, incluso si ésta es privada. Dentro del setter, se puede trabajar con la nueva variable asignada y asignarla a la propiedad deseada. Cuando se llama al getter de esa propiedad, ésta ya habrá cambiado. El setter siempre devuelve el nuevo valor asignado. Por lo tanto, si se desea ver los cambios reflejados, es necesario llamar al getter después de haber utilizado el setter.
La principal ventaja de utilizar getters y setters es que se puede controlar el acceso y la modificación de las propiedades de la clase, lo que permite proteger las propiedades privadas de ser alteradas de manera inapropiada. Además, también permite realizar tareas adicionales cada vez que se accede o se modifica una propiedad.
Es importante destacar que los getters y setters sólo funcionan en navegadores modernos y en versiones recientes de Node.js, y no están disponibles en versiones antiguas de estos entornos. En esos casos, se puede utilizar una sintaxis similar utilizando los métodos "get" y "set" para definir y acceder a las propiedades de la clase.