Para los amantes de la Programación Orientada a Objetos (POO), ES6 también tiene algo para ellos. La creación de clases con constructores y métodos, y la herencia, ya es posible desde esta versión de ECMAScript. Hasta ahora los desarrolladores Javascript habíamos tenido que apañárnoslas si queríamos seguir en nuestras implementaciones un esquema parecido a la orientación a objetos. Por ejemplo, con la creación de módulos y la llamada o instanciación de éstos mediante un objeto que estuviese declarado dentro del módulo y en él estuviesen contenidas las variables (propiedades) o las funciones (métodos). Un ejemplo de dicho esquema lo podemos encontrar aquí. Esto era una manera. Pero ahora podemos tener:
Clases:
|
class Restaurante { constructor(nombre){ this.nombre = nombre; } ubicacion(sitio){ this.sitio = sitio; } } let restaurante = new Restaurante('Foxter'); restaurante.ubicacion('Madrid'); console.log('restaurante'); // Restaurante { nombre: 'Foxter', sitio: 'Madrid' } console.log('restaurante.nombre'); // Foxter console.log('restaurante.sitio'); // Madrid |
Herencia:
Supongamos que queremos tener una clase que sea descendiente de la clase “Restaurante”. Podemos hacerlo del siguiente modo:
|
class Mejicano extends Restaurante { constructor(nombre, comida){ super(nombre); this.nombre = nombre; this.comida = comida; } } let restaurante2 = new Mejicano('Orlando', 'picante'); restaurante2.sitio = 'Barcelona'; console.log(restaurante2); // Mejicano { nombre: 'Orlando', comida: 'picante', sitio: 'Barcelona' } console.log(restaurante2.comida); // Picante |
Creo que se entiende bien, sobre todo para el que esté familiarizado con la POO.
Por otro lado, también podemos implementar getters y setters. Para el mismo ejemplo podríamos hacer:
|
class Restaurante { get nombre(){ return this._nombre; } set nombre(nombre){ this._nombre = nombre; } } let restaurante3 = new Restaurante(); restaurante3.nombre = 'El corral'; console.log(restaurante3.nombre); // El corral console.log(restaurante3.nombre); |
Métodos estáticos:
|
class OperacionMatematica{ static suma(a, b) => a + b; static resta(a, b) => a - b; } console.log(OperacionMatematica.suma(10, 5)) // 15 console.log(OperacionMatematica.resta(10, 7)) // 3 |
Nota: La web donde se encuentra la especificación del standard ECMAScript, y todo lo relacionado con él, se puede consultar en la web oficial.