Szczegóły

Jeśli kiedykolwiek mieliście styczność z innymi językami obiektowymi, bardzo możliwe, że w programując w JavaScript doskwiera Wam brak klas. Do tej pory trzeba było kombinować z funkcjami-konstruktowami i prototypami, co czyniło składnię nieco nieczytelną. Na szczęście twórcy ES6 postanowili posłuchać woli ludu i do specyfikacji ES6 dorzucili długo oczekiwane klasy.

Klasy i konstruktory

Tworzenie klasy obiektu w ES6 jest tak proste, jak tylko można sobie wyobrazić:

class Animal {};

Sposób tworzenia obiektów danej klasy był za to już wystarczająco intuicyjny i nie uległ zmianie w stosunku do ES5:

class Animal {};
var armadillo = new Animal();
console.log(typeof armadillo);

Powyższy kod poskutkuje wypisaniem do konsoli "object", co potwierdza, że pod zmienną armadillo przechowujemy obiekt.

Jako, że każdy mały pancernik lubi, gdy woła się go po imieniu, do naszego kodu powinniśmy dodać konstruktor:

class Animal {
  constructor(name){
    this.name = name
  }
}
var armadillo = new Animal('Bogusław');
console.log(armadillo.name); // Bogusław

Dziedziczenie

Nasz pancernik Bogusław bardzo lubi dobre towarzystwo, w szczególności cietrzewi zwyczajnych. Jako, że ptaki to całkiem spora grupa zwierząt, różniąca się nieco od zwierząt lądowych, przydałoby się stworzyć dla nich osobną klasę dziedziczącą po klasie Animal. Skorzystamy w tym celu ze słowa kluczowego extends:

class Animal {
  constructor(name){
    this.name = name
  }
}

class Bird extends Animal { // dziedziczenie
    constructor(name, wingspan) {
        super(name); // wywołanie nadrzędnego konstruktora
        this.wingspan = wingspan;
    }
}

var armadillo = new Animal('Bogusław');
var blackGrouse = new Bird('Antoni', 62);
console.log(armadillo.name); //Bogusław
console.log(blackGrouse.name + ' ' + blackGrouse.wingspan); //Antoni 62

Istotne rzeczy w powyższym kodzie dzieją się w dwóch zaznaczonych linijkach.  W linii 7 następuje dziedziczenie klasy Bird po klasie Animal za pomocą słowa kluczowego extends. Dzięki temu klasa Bird ma wszystkie właściwości klasy po której dziedziczy, dodając do tego swoje własne (jak w linijce 10). 

Słowo kluczowe super służy do wywołania konstruktora klasy Animal. W rezultacie w linijce 15 możemy wywołać konstruktor podając dwa parametry - jeden zadeklarowany w klasie Animal, drugi w klasie Bird. Jest to chyba wystarczająco intuicyjne i nie wymaga głębszego tłumaczenia. No przynajmniej cietrzew Antoni mówi, że zrozumiał.

Zmienne prywatne i publiczne

To, czego niestety nie oferuje nam mechanizm działania klas w ES6 to koncept zmiennych prywatnych i publicznych. Oczywiście są sposoby na to, by i z tym poradzić sobie w JavaScript, ale nie jest to rozwiązanie tak eleganckie, jak w innych językach. Wiele wskazuje na to, że słowa kluczowe private i public trafią ostatecznie do JavaScript, ale prawdopodobnie dopiero w standardzie ES7.

A co z prototypami?

Właściwie to... nic. Wszystko, co widzicie powyżej to tylko tzw. syntatic sugar. W rzeczywistości za kulisami i tak zachodzi dziedziczenie prototypowe. ES6 daje nam jedynie kilka słów kluczowych, dzięki którym programowanie obiektowe w JavaScript ma być bardziej intuicyjne i zbliżone sładniowo do tego, co znamy z innych języków obiektowych.

Dla tych, dla których JavaScript to jedyny język, z jakim mieli styczność, klasy mogą wydać się zbędne. Nie ma wtedy problemu, by dalej korzystać z prototypów. Ja zachęcam próby zaprzyjaźnienia się z klasami - głównie ze względu na dużo większą czytelność powstałego dzięki nim kodu.