ES6 Class nedir? Nasıl kullanılır?

Classlar ES6 ile javascript ile kullanılabilir durumda olan nesne yönelimli programlamanın temel araçlarından biridir. Javascript prototip tabanlı programlamayı destekleyen bir dilken artık sınıfların kullanılabilmesi ile nesneye yönelik programlamanın özelliklerine sahip bir dil haline geldi.

class ve constructor kullanımı

Classları tanımlarken class tagı ve class ismi şeklinde tanımlayacağız.

Dortgen adında bir sınıf oluşturalım.

class Dortgen {
  constructor(yukseklik, genislik) {
    this.yukseklik = yukseklik;
    this.genislik    = genislik;
  }
}

constructor fonksiyonu class çağırıldığı anda çalışır ve class ın bir değişkene atanırken parametre gönderilmesini sağlar. Class a ait değerler fonksiyonların içinde yada direk class ın içinde this parametresi ile tanımlanır.

Yukarıda oluşturduğumuz class ımızı bir değişkene atamak için new parametresini kullanıyoruz.

const kare = new Dortgen(50,50);

new parametresi ile class ımızı kare değişkenine atadık ve yukseklik ile genislik parametrelerinide verdik.

Şimdi aşağıdaki kodu class.js dosyasına kaydedip babel-node ile çağıralım.

class Dortgen {
  constructor(yukseklik, genislik) {
    this.yukseklik = yukseklik;
    this.genislik    = genislik;
  }
}

const kare = new Dortgen(50,50);

console.log('yukseklik : ' + kare.yukseklik + ' genislik : ' + kare.genislik);

çıktı:
yukseklik : 50
genislik : 50

Dortgen class ını atadığımı kare değişkenine atanan yukseklik ve genislik değerlerine kare.yukseklik şeklinde ulaşabiliyoruz.

Şimdi alan isminde dörtgenin alanının hesaplanacağı bir fonksiyon ekleyelim.

class Dortgen {
  constructor(yukseklik, genislik) {
    this.yukseklik = yukseklik;
    this.genislik    = genislik;
  }
  alan(){
    return this.yukseklik * this.genislik;
  }
}

const kare = new Dortgen(50,50);

console.log(kare.alan());

get,set ve static kullanımı

get parametresi ile oluşturulan bir fonksiyona değer olarak ulaşıyoruz.

class Kisi {
    constructor(isim){
        this.isim = isim;
    }
    get isim(){
        return this.isim.toUpperCase();
    }
}

const ogrenci = new Kisi('ali');
console.log(ogrenci.isim);

çıktı:
ALI

get parametresi geri döndürülecek olan istediğimiz bir değeri fonksiyonu içerisinde değiştirerek yine class a ait bir eleman şeklinde erişmemizi sağlayan bir parametre.

set parametresi ile değer atanacak olan class elemanına atanacak değeri izleyebiliyoruz.

class Kisi {
    constructor(isim){
        this._isim = isim;
    }
    set isim(isim){
        if(typeof isim == "string")
            this._isim = isim;
        else 
            this._isim = "isim değeri string olmalıdır.";
    }
    get isim(){
        return this._isim.toUpperCase();
    }
}

const ogrenci = new Kisi('ali');
ogrenci.isim = 1;
console.log(ogrenci.isim);

çıktı:
ISIM DEĞERI STRING OLMALIDIR.

set parametresi ise örneğin değiştirilecek olan değerin istenilen tipte olup olmadığını kontrol etmek gibi şeylere yarıyor.

static parametresi ile direkt olarak class adı ile erişilmesini istediğimiz fonksiyonlar için kullanılıyor.

class Islem {
    static topla(a,b){
        return a + b;
    }
}

console.log(Islem.topla(5,5));

çıktı:
10

extends ve super kullanımı

Bir silindirin hacminin hesaplayabilen Silindir class ı oluşturalım.

class Daire {
    constructor(yaricap){
        this.pi = 3.14;
        this.yaricap = yaricap;
    }
    get alan(){
        return Math.sqrt(this.yaricap) * this.pi;
    }
}

class Silindir extends Daire {
    constructor(yaricap,yukseklik){
        super(yaricap);
        this.yukseklik = yukseklik;
    }
    get hacim(){
        return this.yukseklik * super.alan;
    }
}

const silindir = new Silindir(10,50);
console.log(silindir.hacim);

çıktı:
496.47759264643565

Yukarıda Silindir ve Daire isminde iki class oluşturduk. extends ile Daire class ını Silindir e dahil ettik. super parametresi ile Daire class ının değer ve fonksiyonlarına erişerek alan fonksiyonunu hacim fonksiyonunda kullandık ve silindirin hacmini hesapladık. get parametresi ile fonksiyon olarak değilde direk bir eleman şeklinde erişilebilmesini sağladık.

Class kullanımı basit örnekler ile açıklamaya çalıştım. Sonraki derslerde görüşmek üzere.