JavaScript “Object”, “Property”, “Prototype”, “Constructor” kullanımı

Zaten uzun uzun yazılar yazıyoruz. Bunu zaten bir çok blogger da yapıyor.

Fakat bu başlıktaki gibi kısa bir bilgiyi o yığınlarca kelime haznelerinden insanların bulması güçleşiyor. O nedenle ara ara bu gibi kısa bilgilendirmeleri yapacağız.

Property

JavaScript Property, objelere özellik eklemek olarak tercüme edilebilir.

var siteAccount = {}; // Object
siteAccount.number = 114521; // Property

Bir property eğer bir fonksiyonu işaret ediyorsa ona methoddiyebiliriz.

var siteAccount = {}; // Object
siteAccount.number = 114521; // Property
siteAccount.name = function() {
     return  "vanillajs.wordpress.com";
};

Constructor

Constructor (Kurucu metodu), ise;

var siteAccount = function(number, name){
   this.number = number;
   this.name = name;
   return this.number + " - " + this.name;
};

var newSiteAccout = new siteAccout("112473", "vanillaJS");

console.log(newSiteAccount); 
//log -> 112473 - vanillaJS

Prototype

Bir fonksiyonun içinde “this”‘i kullanarak aitliği belirleyebiliyoruz. Peki ya o fonksiyonun dışında yazmak istersek? İşte o zaman Prototiplerini oluşturmamız gerekir.

Javascript Object tipinde bulunan prototype adlı özel bir metod, tüm nesnelerde bulunur. Bu metod sayesinde nesnelere yeni property veya metodlar ekleyebilirsiniz. Constructor fonksiyonları ile kendi özel tiplerimizi oluşturmamız mümkündür. Oluşturduğumuz tipe ait iki farklı nesne örneği oluşturacağımız vakit her bir nesne örneği kendi property kümesini bünyesinde barındırır. Bu durum, veri tutucu property’ler için makul görünse de metodlar için bir sorun haline gelebilir. Metodlarımızı oluşturduğumuz tip içerisinden ayırabiliriz.

[1]

Örnek-1: Prototype kullanılmadan [1] 

var Rectagle = function (x,y) {
     this.x = x;
     this.y = y;
     this.Area = function() { return x*y; };
};

Örnek-2: Prototype kullanarak [1] 

var Rectangle = function (x, y) {
    this.x = x;
    this.y = y;
};
 
Rectangle.prototype = {
    Area: function() { return (this.x * this.y); }
};

Örnek-1 deki alan hesaplayıcı metod olan Area metodu Örnek-2 de tipin prototype metoduna tanımlanmıştır. [1]

Bu bize ne fayda sağlamıştır? Örnek-1 de constructor içinde tanımlanan fonksiyon için her Rectangle nesnesi oluşturulduğunda bellekte anonim bir fonksiyon oluşturulacak ve yer tutacak. Ancak Örnek-2 de durum farklı olacaktır. Prototype property’ler static olduklarından her Rectangle nesnesi prototype içine tanımlanan metotları referans olarak görecektir. [1]

Ayrıca Rectange tipine ait değer tutucu (x,y) üyeler ve fonksiyonlar ayrılmış oldu. Bu ayrımı farklı Javascript dosyalarına bile dağıtmak mümkündür. [1]

Prototype kullanımı öncelikli olarak performans artışı sağlamakla birlikte kodun okunabilirliğini de arttırmak açısından faydalı olmaktadır. [1]

Alıntı: [1]


Bayram Üçüncü | bayramucuncu.com/avascript-nesne-kavrami/

Yorum bırakın