Javascript Class ve Nesne Oluşturma

1 Tem

Javascript programlama dili, geleneksel programlama dillerindeki gibi gelişmiş özelliklere sahip olmasa da nesneye yönelik programlama açısından son derece esnek bir yapıya sahiptir. Bu yazıda nesneye yönelik programlamada önemli bir yer tutan class yapısını incelemeye çalışacağız.

Javascript dilinde class benzeri tanımlamalar fonksiyonlar yardımıyla yapılmaktadır. Class benzeri diyorum çünkü geleneksel programlama dillerindeki gibi class tanımlamak için özel bir yöntem yoktur. Her fonksiyon bir class olarak değerlendirilebilir ve her fonksiyonun new anahtar sözcüğü ile bir nesnesi oluşturulabilir.

1-Fonksiyon Tanımlamak

Normal bir Javascript fonksiyonu tanımlayarak aşağıdaki gibi bir class oluşturabiliriz.


function Map(name){
    this.name = name;
    this.version = "1.0.0";
    this.zoomLevel = 0;
    this.zoomin = zoomIn;
}

function zoomIn(){
    return this.zoomLevel + 1;
}

Yukarıda tanımlanan bir constructor fonksiyondur. Aynı zamanda class olarak değerlendirilir.  Bu class tipinde bir nesne aşağıdaki gibi oluşturulabilir.


var map = new Map("myMap");
map.version = 1.1.1;
map.zoomin();

2-Anti Pattern

Yukarıda tanımlama da zoomIn metodu Map calss dışında ayrı bir şekilde tanımlandığından  bir anti pattern oluşmaktadır. Kodun çalışması açısından hiç bir sorun yoktur. Ancak dışarıda tanımlanan her metod, global namespace içerisinde yer alacağından başka bir amaçla aynı isimde (zoomIn) bir metod tanımlandığında bu durum bir isim karışıklığına sebep olacaktır. Bu tür kirliliklerin önüne geçmek adına ihtiyaç duyulan metodlar constructor fonksiyonların içerisine tanımlanmalıdır.

function Map(name){
    this.name = name;
    this.version = "1.0.0";
    this.zoomLevel = 0;
    this.zoomin = function(){
           return this.zoomLevel + 1;
    }
}

Bu şekilde bir tanımlama kodda her hangi bir değişikliğe sebep olmayacaktır.

3-Metodların Prototype Şeklinde Tanımlanaması

2. maddede olduğu gibi metodları constructor fonksiyon içerisine tanımlayarak anti pattern oluşumundan kurtulmak mümkündür. Ancak bu durumun karşımıza çıkardığı bir dezavantaj vardır. Her nesne oluşturulduğunda zoomin() metodu yeniden oluşturulacaktır. Bu dezavantajı ortadan kaldırmak için zoomin() metodu prototype olarak tanımlanmalıdır.

function Map(name){
    this.name = name;
    this.version = "1.0.0";
    this.zoomLevel = 0;
}

Map.prototype.zoomin = function(){
    return this.zoomLevel + 1;
}

4-Doğrudan Nesne Tanımlamak

Şu ana kadar olan bölümlerde constructor fonksiyonlar yardımıyla sınıf simülasyonları olşuturduk ve new anahtar sözcüğü ile bu constructor fonksiyonlardan nesneler oluşturduk. Bu bölümde doğrudan nesneler tanımlamayı inceleyeceğiz.

Javascript dilinde doğrudan nesne tanımlamak object literal olarak geçer. Doğrudan oluşturulan  nesnelerden new anahtar sözcüğü ile tekrardan nesneler oluşturulamaz. Doğrudan bir nesne oluşturmak:

  var obj = {};

veya

  var obj = new Object();

şeklinde yapılabilmektedir.

Dizler için doğrudan nesne oluşturmak:

  var arr = [];

veya

  var arr = new Array();

şeklinde yapılır.

Herhangi bir sınıf tanımlamadan Map nesnesini doğrudan oluşturmak mümkündür.

var map = {
    this.name = name,
    this.version: "1.0.0",
    this.zoomLevel: 0,
    this.zoomin: function(){
        return this.zoomLevel + 1;
    }
}

Artık bu nesneyi doğrudan kullanmak mümkündür.

   map.version = 1.1.1;
   map.zoomin();

Bu tür tanımlamalar singleton olarak da geçer.

5-Fonksiyonlar Yardımıyla Singleton Nesne Tanımlamak

var map = new function(name){
    this.name = name;
    this.version = "1.0.0";
    this.zoomLevel = 0;
    this.zoomin = function(){
           return this.zoomLevel + 1;
    }
}

Burada tanımlanan constructor fonksiyonunun önünde new anahtar sözcüğü kullanıldığında doğrudan bir nesne oluşturulmuştur.

Böylece Javascript dilinde class ve doğrudan nesne kavramını ve bu türlerin nasıl tanımlandığını ve kullanıldığını incelemiş olduk. Bir sonraki makalede görüşmek üzere.