-- Genel, Javascript

JavaScript ile Nesne Yönelimli Programlama – 1

Modern yazılımlarda gerekli olan özelliklerin başında nesne yönelimli mimari gelmektedir(fonksiyonel programlama apayrı bir gereksinim tabiki). İngilizce olarak Object Oriented Programming(OOP) isimlendirmesi bir programlama yönteminden öte bir dil özelliğidir. Bunu nasıl gerçekleştirdiği konusu dillere göre farklılık gösterebilir ancak dil desteklemiyorsa OOP söz konusu olamamaktadır(Örn; C, Haskell, Scala vb. programlama dilleri). JavaScript alanında jQuery‘nin açtığı sunucu odaklı JavaScript programlama kapısını Node.js, Socket.io gibi bir çok sunucu odaklı framework takip etmektedir. Ne işe yaradıkları konusu apayrı konular, ancak eskiden websitesinde kar yağdırma efekti olarak kullanılan JavaScript’in hangi seviyeye geldiğini anlayabilmek için biraz yenilikleri takip etmek yeterli olacaktır.

JavaScript dilinin gelecekte daha da etkili olacağına inanıyorum. Örnek vermek gerekirse, şuan Node.js ile Quadcopter programlanabilmektedir. Hatta programlama yarışması bile yapıyorlar. 🙂

Konumuza dönecek olursak, JavaScript fonksiyonel bir dildir. Ancak ileri seviye olmasada nesne yönelimli programlamaya izin vermektedir. Bu makalemizde temel seviyede bu işlemin nasıl yapıldığına değineceğim.

Örnekleri hızlı ve kolay geliştirip, test edebilmek için jsbin.com isimli online JavaScript debugger’ını kullanacağım.

Örnek olarak ekrana basit bir mesaj yazdıralım.

– Siteye giriş yaptıktan sonra New bin butonu ile yeni bir konsol açın.
– Üst kısımdaki sekmelerden sadece JavaScript ve Console aktif olsun.

Sol kısımdaki alana console.log(“Merhaba!”); yazın.

1

Sağ köşedeki Run butonuna bastıktan sonra sağda çıktıyı görebilirsiniz.

2

C# ve Java gibi programlama dillerinde OOP temelini class keyword’ü oluşturmaktadır. Ancak JavaScript’te class keyword’ü bulunmaz. Bunun yerine fonksiyon mantığıyla nesne yönelimi modellenir. Bu nedenle ilk iş olarak bir fonksiyon oluşturalım.

function Kisi(id, ad, soyad, email)
{
  this.Id = id;
  this.Ad = ad;
  this.Soyad = soyad;
  this.Email = email;
}

Kisi isimli fonksiyonumuzu C#’taki Kisi sınıfı gibi düşünebilirsiniz. Dışarıdan 4 parametre alıyor ve bunları içerideki 4 property’e atıyor. Yalnız burada dikkat ederseniz, this.Id gibi belirttiğimiz tanımlamalardaki Id, Ad, Soyad, Email nesnelerini tanımlamadık. Çünkü gerek yok! Kendisi hallediyor sağolsun. Sınıfımız hazır. Ancak hatırlarsanız oluşturulan bir sınıfın değerini genelde oluşturacağımız metodlar ile biçimlendirerek elde etmekteydik. Bu kuralı bozmadan JavaScript metodlarımızı oluşturalım.

Kisi sınıfımızın nesne örneğini oluşturduktan sonra kişinin mailini bilgi olarak biçimlendirilmiş şekilde gösterecek metodu oluşturalım.

– MailBilgi() metodu :

 Kisi.prototype.MailBilgi = function()
{
  console.log('**************************');
  console.log("Merhaba " + this.Ad + " bey, email adresiniz : " + this.Email);
  console.log('**************************');
}

Yukarıdaki metod mantığı biraz farklı görünebilir. Şöyleki; Oluşturduğumuz Kisi sınıfına(JS’de metod idi) ait bir metod tanımlamalıyız. Ancak C# benzeri bir sınıf -> metod hiyerarşisi olmadığı için bir şekilde sınıfa bağlı olmalıdır. Bunu sağlamak içinde prototype’lar kullanılır. Prototype’lar özetle bir sınıfa ait olan ve her nesne oluşturulurken değil, sadece bir kez oluşturulan nesnelerdir. Birebir aynı olmasada, kavrayabilmeniz için C#’daki statik metod kullanımına benzer diyebiliriz. Prototype’lar metod olmak zorunda da değildir. Değişken vb. nesne de olabilir. Ancak bizim işimiz için en doğru nesne metodlardır.

Kişi sınıfının nesne örneğini oluşturduktan sonra kişinin tüm bilgilerini biçimlendirilmiş şekilde gösterecek metodu oluşturalım.

– Bilgiler() metodu :

Kisi.prototype.Bilgiler = function()
{
  console.log('**************************');
  console.log("Kullanıcı ID : " + this.Id);
  console.log("Ad : " + this.Ad);
  console.log("Soyad : " + this.Soyad);
  console.log("Email : " + this.Email);
  console.log('**************************');
}

Artık temel olarak istediğimiz işlemleri gerçekleştirebiliriz.

Öncelikle Kisi sınıfının nesne örneğini oluşturalım;

var cihan = new Kisi(7,'Cihan','Özhan','cihan.ozhan@hotmail.com');

Sonrasında MailBilgi() ve Bilgiler() isimli metodlarımızı çağıralım.

cihan.MailBilgi();
cihan.Bilgiler();

Yukarıdaki işlemleri adım adım tamamladıktan sonra sağ kısımdaki Run butonuna basın. Sonuç aşağıdaki gibi olmalıdır.

3

Peki Kisi sınıfının miras alan yeni bir sınıf(fonksiyon) yazmak istersek ne yaparız?

Bunun için kullanacağımız yöntem gene nesne yönelimli bir özellik olacak. Yeni oluşturacağımız fonksiyon içerisinde önceki sınıfıı çağıracağız(call etmek).

Şimdi Ogrenci isimli yeni bir sınıf oluşturalım.

function Ogrenci(id, ad, soyad, email, ogrNo)
{
  Kisi.call(this, id, ad, soyad, email);
  this.OgrenciNo = ogrNo;
}

Dikkat ederseniz Kisi sınıfında kullanılan parametreleri tekrar tekrar tanımlamadık. Bunun yerine Kisi sınıfının call() metodunu çağırarak ilk parametrede(this) sınıfın kendisini, sonrakilerde ise aktarılacak parametreleri verdik. Son parametre(OgrenciNo) ise Kisi sınıfında olmadığı için Ogrenci sınıfı içerisinde tanımladık. Genede bu kullanım teknik olarak doğru olsa da prototype’ların aktarımı için yetersizdir. Ogrenci sınıf tanımlamasının hemen altına aşağıdaki gibi Kisi sınıfının prototype’larını alıp Ogrenci sınıfına aktaran tanımlamayı yapalım.

Ogrenci.prototype = Object.create(Kisi.prototype);
Ogrenci.prototype.constructor = Ogrenci;

Bu işlemden sonra Kisi sınıfının prototype’ları da artık Ogrenci sınıfı tarafından kullanılabilir olacaktır. Deneyelim;

// nesne örneğini oluşturalım.
var ogrenci = new Ogrenci(1,"CO","Özhan","co@ozhan.com",123654789); 

ogrenci.MailBilgi();
ogrenci.Bilgiler();

Sonuç;

4

C# ya da Java ile OOP tasarımı yaptıysanız miras alınan sınıftaki bazı metodların override edilmesi gerekliliğini biliyorsunuzdur. Burada da override işlemini yapabiliyoruz. Mesela Kisi sınıfında bulunan MailBilgi() isimli prototype’ı değiştirerek öğrenci bilgisine uygun hale getirelim ve kullanalım. Bunun için Kisi sınıfındaki prototype ile aynı isme sahip yeni prototype’ı Ogrenci sınıfı için oluşturmak yeterli olacaktır.

Ogrenci.prototype.MailBilgi = function()
{
  console.log('**************************');
  console.log("Sn. Öğrencimiz, öğrenci numaranız(" + this.OgrenciNo + ") mail adresiniz(" + this.Email + ")");
  console.log('**************************');
}

ogrenci isimli nesne örneği ile MailBilgi() ve Bilgiler() metodlarını tekrar çağıralım.

ogrenci.MailBilgi();
ogrenci.Bilgiler();

Sonuç;

5

Not : Makale yazımı devam ediyor.

Yorumla

Yorum