JavaScript Nesne Prototipleri 2

JavaScript'te nesnelere prototip eklemek oldukça yaygın bir tekniktir. Prototipler, bir nesnenin tüm örnekleri tarafından paylaşılan özellik ve yöntemlerin depolandığı bir "şablondur". Böylece, her bir nesne kendi özel özelliklerini ve yöntemlerini içerebilirken, aynı zamanda prototipteki ortak özelliklere ve yöntemlere erişebilir. JavaScript Nesne Prototipleri 1 Konusu için Bakınız.

İşte basit bir örnek:


// Bir Araba prototipi oluşturalım
function Araba(marka, model) {
  this.marka = marka;
  this.model = model;
}

// Prototipimize bir metod ekleyelim
Araba.prototype.tanitim = function() {
  console.log("Bu araba " + this.marka + " " + this.model + ".");
};

// Yeni bir araba örneği oluşturalım
var araba1 = new Araba("Toyota", "Corolla");
araba1.tanitim(); // Çıktı: "Bu araba Toyota Corolla."

// Başka bir araba örneği oluşturalım
var araba2 = new Araba("Honda", "Civic");
araba2.tanitim(); // Çıktı: "Bu araba Honda Civic."

Yukarıdaki örnekte, Araba adında bir yapılandırıcı fonksiyon tanımlıyoruz. Bu fonksiyon, marka ve model adında iki özellik alır ve bunları yeni oluşturulan nesnenin özelliklerine atar.

Sonra, Araba.prototype üzerinde tanitim adında bir metod ekliyoruz. Bu metod, arabayı tanıtan bir mesajı konsola yazdırır. Bu metod, Araba nesnesinin tüm örnekleri tarafından paylaşılır.

Daha sonra, new anahtar kelimesiyle Araba yapılandırıcısından iki araba örneği oluşturuyoruz. Her bir örneği oluşturduktan sonra, tanitim metodunu çağırarak ilgili arabayı tanıtıyoruz.

Bu örnekte, her iki araba örneği de Araba prototipine bağlıdır ve prototipteki tanitim metodunu kullanabilir. Ancak, her bir örnek ayrı ayrı marka ve model özelliklerine sahiptir.

Bu, JavaScript'te prototiplerin temel bir kullanım örneğidir. Prototipler, nesneler arasında kod paylaşımını sağlamak ve bellek kullanımını optimize etmek için yaygın olarak kullanılır.

Başka bir örnek üzerinden devam edelim:


  
// Bir Meyve prototipi oluşturalım
function Meyve(ad, renk) {
  this.ad = ad;
  this.renk = renk;
}

// Prototipimize bir metod ekleyelim
Meyve.prototype.tanitim = function() {
  console.log("Bu meyve " + this.ad + " ve rengi " + this.renk + ".");
};

// Yeni bir meyve örneği oluşturalım
var meyve1 = new Meyve("Elma", "Kırmızı");
meyve1.tanitim(); // Çıktı: "Bu meyve Elma ve rengi Kırmızı."

// Başka bir meyve örneği oluşturalım
var meyve2 = new Meyve("Muz", "Sarı");
meyve2.tanitim(); // Çıktı: "Bu meyve Muz ve rengi Sarı."

Bu örnekte, Meyve adında bir yapılandırıcı fonksiyon tanımlıyoruz. Bu fonksiyon, ad ve renk adında iki özellik alır ve bunları yeni oluşturulan nesnenin özelliklerine atar.

Sonra, Meyve.prototype üzerinde tanitim adında bir metod ekliyoruz. Bu metod, meyveyi tanıtan bir mesajı konsola yazdırır. Bu metod, Meyve nesnesinin tüm örnekleri tarafından paylaşılır.

Daha sonra, new anahtar kelimesiyle Meyve yapılandırıcısından iki meyve örneği oluşturuyoruz. Her bir örneği oluşturduktan sonra, tanitim metodunu çağırarak ilgili meyveyi tanıtıyoruz.

Bu örnekte de, her iki meyve örneği de Meyve prototipine bağlıdır ve prototipteki tanitim metodunu kullanabilir. Ancak, her bir örnek ayrı ayrı ad ve renk özelliklerine sahiptir.

Prototipler, JavaScript'te nesne tabanlı programlamanın önemli bir parçasıdır ve kodunuzda tekrarlayan özellikleri ve metotları ortak bir yerde saklamanızı sağlar. Bu sayede, bellek kullanımını optimize ederken kodunuzu daha düzenli ve sürdürülebilir hale getirebilirsiniz.

JavaScript'te yerleşik nesnelere prototip eklemek oldukça yaygın bir tekniktir. Prototipler, JavaScript'in nesne tabanlı modelinde nesneler arasında kalıtım ilişkisi kurmamızı sağlar.

Bir yerleşik nesneye prototip eklemek için prototype özelliğini kullanırız. Örneğin, Array nesnesine yeni bir metod eklemek istediğimizde şu adımları izleyebiliriz:

  
Array.prototype.myMethod = function() {
  // Yeni metodu tanımla
};

Yukarıdaki örnekte, Array.prototype üzerine myMethod adında bir fonksiyon ekledik. Artık tüm dizi nesneleri bu metodu kullanabilir.

Benzer şekilde, diğer yerleşik nesnelere de prototip ekleyebilirsiniz. Örneğin, String nesnesine yeni bir metod eklemek istediğinizde aşağıdaki gibi yapabilirsiniz:

  
String.prototype.myMethod = function() {
  // Yeni metodu tanımla
};

Bu yöntemle, yerleşik nesnelerin prototiplerine yeni metodlar ekleyebilir ve mevcut metodları değiştirebilirsiniz. Ancak, yerleşik nesnelerin prototiplerine yapılan değişikliklerin dikkatli bir şekilde yapılması gerekmektedir, çünkü bu değişiklikler tüm projede etkili olabilir ve beklenmeyen sonuçlara neden olabilir. Prototipleri değiştirirken dikkatli olmalı ve diğer geliştiricilerin kodlarını etkilemeden önce bu değişiklikleri iyi düşünmelisiniz.

Array ve String nesnelerine prototip üzerinden özellik ve metod eklemek için basit örnekler:

  
// Array nesnesine prototip üzerinden özellik ekleme
Array.prototype.toplam = function() {
  var toplam = 0;
  for (var i = 0; i < this.length; i++) {
    toplam += this[i];
  }
  return toplam;
};

var dizi = [1, 2, 3, 4, 5];
console.log(dizi.toplam()); // Çıktı: 15

// String nesnesine prototip üzerinden metod ekleme
String.prototype.tersCevir = function() {
  var ters = "";
  for (var i = this.length - 1; i >= 0; i--) {
    ters += this.charAt(i);
  }
  return ters;
};

var metin = "Merhaba";
console.log(metin.tersCevir()); // Çıktı: abahreM


Yukarıdaki örnekte, Array nesnesinin prototipine toplam adında bir metod eklenir. Bu metod, bir dizi içindeki sayıların toplamını hesaplar. Array.prototype üzerinde yapılan değişiklikler, tüm dizi örnekleri tarafından kullanılabilir hale gelir. Örnekteki dizi üzerinden toplam metodunu çağırarak dizideki sayıların toplamını elde edebiliriz.

Aynı şekilde, String nesnesinin prototipine tersCevir adında bir metod eklenir. Bu metod, bir metni tersine çevirir. String.prototype üzerinde yapılan değişiklikler, tüm string örnekleri tarafından kullanılabilir hale gelir. Örnekteki metin üzerinden tersCevir metodunu çağırarak metni ters çevirebiliriz.

Date nesnesine özel bir metot eklemek:



Date.prototype.getFormattedDate = function() {
  const year = this.getFullYear();
  const month = ('0' + (this.getMonth() + 1)).slice(-2);
  const day = ('0' + this.getDate()).slice(-2);
  return `${day}/${month}/${year}`;
};

const currentDate = new Date();
console.log(currentDate.getFormattedDate()); // "11/06/2023"


Bu örnekte, getFormattedDate adında bir metot ekledik ve bu metot, bir tarih nesnesini belirli bir formatla biçimlendirmek için kullanıldı.

Bu örnekler, yerleşik JavaScript nesnelerine prototip eklemek için sadece birkaç örnektir. JavaScript'te prototip tabanlı kalıtımın güçlü bir yanı vardır ve bu teknik sayesinde yerleşik nesneleri genişletebilir ve özelleştirebilirsiniz. Ancak, prototiplere yapılan değişikliklerin dikkatli bir şekilde yapılması ve olumsuz etkileri göz önünde bulundurulması önemlidir.

Bu örneklerde, JavaScript'in prototip tabanlı doğasından faydalanarak, yerleşik nesnelere (Array,Date ve String) ekstra özellikler veya metotlar eklemeyi gösteriyoruz. Ancak, prototiplere eklemeler yaparken dikkatli olmalı ve üzerine yazılabilirlik veya çakışmalar gibi potansiyel sorunlara karşı önlemler almalısınız.

Lütfen konu haricinde soru sormayın cevaplanmayacaktır. Yorumunuz onaylandıktan sonra yayınlanacaktır. Lütfen Yukarıda ki mesajları okuyun tekrar aynı soruları sormayın.

5146

KATEGORİ
  • HTML
  • CSS
  • PHP
  • JQUERY
  • PHOTOSHOP
  • JavaScript
  • Web Dünyası
  • Linux
  • MİTHRİL FRAMEWORK
  • Laravel
  • Git
  • React
POPÜLER MAKALE
  • HTML LİNK(Bağlantı)EKLEME - LİNK VERME
  • HTML YAZI VE RESİM ORTALAMA
  • HTML RESME LİNK VERME
  • HTML FORM OLUŞTURMA
  • CSS YATAY MENÜ YAPIMI
  • HTML RESİM EKLEME
  • CSS (BOYUT) GENİŞLİK VE YÜKSEKLİK (Width-Height)
  • HTML DİV ve SPAN NEDİR?
  • HTML ARKAPLANA MÜZİK EKLEME
  • KALİTE KAYBETMEDEN RESİMLERİ BÜYÜTME
ETİKET
WEBCEBİR © 2013 Tüm hakları saklıdır.