Por fin tenemos la ansiada palabra reservada que tanta polémica había generado durante estos años en el mundo de JavaScript: class. El magnífico post del Dr. Axel Rauschmayer y el libro de Nicholas C. Zakas Understanding ECMAScript6 explican cómo funcionan las clases en JavaScript.

La definición básica es:

let Person = class Person {};  

Dentro de la definición tenemos el constructor:

let Person = class Person{  
    constructor( name, surname ){
        this.name = name;
        this.surname = surname;
    }
}

En este, como en todos los constructores, pasamos todos los parámetros requeridos para la instanciación de la clase.

Podemos definir métodos estáticos y métodos de instancia:

let Person = class Person {  
    constructor( name, surname ){
        this.name = name;
        this.surname = surname;
    }

    static searchByAdress(address){
        return database.findPersonByAdress( address );
    }

    fullname(){
        return `${this.name} ${this.surname}`
    }
}

let dani = new Person( "dani", "lopez" );  
console.log( dani.fullname() );  

Hasta aquí es bastante parecido a lo que sabemos en general sobre las clases. Luego hay un par de temas que me han resultado particularmente interesante. Por ejemplo, es posible definir getter y setter para propiedades de las clases de la siguiente forma:

let Person = class Person {  
    constructor( name, surname ){
        this.name = name;
        this.surname = surname;
    }

    static searchByAdress(address){
        return database.findPersonByAdress( adress );
    }

    fullname(){
        return `${this.name} ${this.surname}`
    }

    get city() {
        return `I live in ${this.address}`;
    }

    set city( address ){
        this.address = address
    }
}

let dani = new Person( "dani", "lopez" );  
console.log( dani.fullname() );

dani.city = "Málaga";  
console.log( dani.city ); // I live in Málaga  

Puedes usar símbolos para poder definir iteradores sobre nuestra clase:

let Person = class Person {  
    constructor( name, surname ){
        this.name = name;
        this.surname = surname;
    }

    static searchByAdress(address){
        return database.findPersonByAdress( adress );
    }

    fullname(){
        return `${this.name} ${this.surname}`
    }

    get city() {
        return `I live in ${this.address}`;
    }

    set city( address ){
        this.address = address
    }

    set nicknames( nicknames ){
      this._nicknames = nicknames
    }

    * [Symbol.iterator](){
      for(let nickname of this._nicknames )
      {
        yield nickname
      }
    }
}

let dani = new Person( "dani", "lopez" );  
console.log( dani.fullname() );

dani.city = "Málaga";  
console.log( dani.city ); // I live in Málaga

dani.nicknames = ["el porras", "el conejo loco"]  
for(let nickname of dani){  
  console.log(nickname)

  // el porras
  // el conejo loco
}

Nuestra función symbol.iterator está precedida por un asterisco. Esto la convierte en un generador y por ello podemos iterar tan fácilmente. Además, y aunque personalmente no le acabo de ver la utilidad, también podemos crear nombres de métodos compuestos.

let Person = class Person {  
    constructor( name, surname ){
        this.name = name;
        this.surname = surname;
    }

    static searchByAdress(address){
        return database.findPersonByAdress( adress );
    }

    fullname(){
        return `${this.name} ${this.surname}`
    }

    get city() {
        return `I live in ${this.address}`;
    }

    set city( address ){
        this.address = address
    }

    set nicknames( nicknames ){
      this._nicknames = nicknames
    }

    * [Symbol.iterator](){
      for(let nickname of this._nicknames )
      {
        yield nickname
      }
    }

    ['WT' + 'F'](){
      console.log( 'WTF!!' );
    }
}

let dani = new Person( "dani", "lopez" );  
console.log( dani.fullname() );

dani.city = "Málaga";  
console.log( dani.city ); // I live in Málaga

dani.nicknames = ["el porras", "el conejo loco"]  
for(let nickname of dani){  
  console.log(nickname)
}

console.log( dani.WTF() );  

Este es el esquema básico para crear una clase base. Para seguir jugando con este tipo de ejemplos, utiliza el RPL online de Babel

Suscríbete a mi lista de correo

* Campos obligatorios