If you're seeing this message, it means we're having trouble loading external resources on our website.

Bağlandığınız bilgisayar bir web filtresi kullanıyorsa, *.kastatic.org ve *.kasandbox.org adreslerinin engellerini kaldırmayı unutmayın.

Ana içerik

İnceleme: Nesne Odaklı Tasarım

Bu, bu derste nesne yönelimli tasarımla ilgili yaptıklarımızın bir tekrarıdır.
Programlar oluşturduğumuzda, genellikle benzer özelliklere sahip birçok farklı nesne oluşturmak isteriz - kürklerinin rengi ve boyutu biraz farklı olan birçok kedi, veya değişik etiket ve konumlu birçok buton gibi. "Bu bir kedinin genel halidir" ve sonra da, "şu özel kediyi, sonra da şu kediyi yapalım, bunlar bazı yönlerden benzer ve bazı yönlerden farklı olsunlar" diyebilmek istiyoruz. Bu durumda, nesne türlerini tanımlamak ve bu nesnelerin yeni örneklerini oluşturmak için nesne yönelimli tasarım kullanmak isteriz.
JavaScript'de bir nesne türü tanımlamak için, önce bir "yapıcı fonksiyonu" tanımlamamız gerekir. Bu nesne türünden yeni bir örnek oluşturmak istediğimizde kullanacağımız fonksiyon budur. İşte Kitap nesne türü için bir yapıcı fonksiyon:
var Book = function(title, author, numPages) {
this.title = title;
this.author = author;
this.numPages = numPages;
this.currentPage = 0;
};
Bu fonksiyon her kitapta farklı olacak özellikler için argümanlar alır - kitabın adı, yazarı, ve sayfa sayısı. Sonra bu argümanlara göre, bu nesnenin başlangıç özelliklerini, this anahtar sözcüğü kullanarak kurar. Bir nesnede this kullandığımızda, bir nesnenin geçerli durumundan, kendisinden bahsediyoruz. Sonradan hatırlayabilmek için, özellikleri thisin üzerinde saklamalıyız.
Book nesnesinin bir örneğini oluşturmak için, bunu saklamak için yeni bir değişken tanımlarız; sonra bu new anahtar sözcüğü, ardından yapıcı fonksiyon ismini kullanırız ve yapıcının beklediği argümanları geçiririz:
var book = new Book("Robot Dreams", "Isaac Asimov", 320);
Sonra, bu nesnede sakladığımız özelliklere nokta notasyonunu kullanarak erişebiliriz:
println("I loved reading " + book.title); // I loved reading Robot Dreams
println(book.author + " is my fav author"); // "Isaac Asimov" is my fav author
Bunu bir dakikalığına karşılaştıralım ve eğer yapıcı fonksiyonumuzu doğru kurmasaydık, neler olacağını gösterelim:
var Book = function(title, author, numPages) {
};
var book = new Book("Little Brother", "Cory Doctorow", 380);
println("I loved reading " + book.title); // I loved reading undefined
println(book.author + " is my fav author"); // undefined is my favorite author
Eğer argümanları yapıcı fonksiyona geçirir, ama açıkça this üzerinde saklamazsak, daha sonra bunlara erişemeyiz! Nesne onları çoktan unutmuş olur.
Nesne türlerini tanımladığımızda, genellikle onları hem özellik hem de davranış ile ilişkilendirmek isteriz - tüm kedi nesnelerimizin meow() ve eat() yapabilmesi gibi. Dolayısıyla, nesne türü tanımlarımıza fonksiyon ekleyebilmemiz gerekir ve bunu adına nesne prototipi denilen şeyde tanımlayarak yapabiliriz:
Book.prototype.readItAll = function() {
  this.currentPage = this.numPages;
  println("You read " + this.numPages + " pages!");
};
Bu fonksiyonun normal tanımına benzer, ama bunu global olarak tanımlamak yerine Book prototipine takarız. Böylece, JavaScript bunun herhangi bir Book nesnesinde çağırılabilecek bir fonksiyon olduğunu ve bu fonksiyonun çağırıldığı kitapta this'e erişimi olması gerektiğini bilir.
Sonra da fonksiyonu (nesneye bağladığımız için buna yöntem deriz) şöyle çağırırız:
var book = new Book("Animal Farm", "George Orwell", 112);
book.readItAll(); // 112 sayfa okudunuz!
Unutmayın, nesne yönelimli tasarımın esas amacı, bizim birden fazla ilişkili nesneyi yapmamızı (nesne örnekleri) kolaylaştırmasıdır. Bunu kodda görelim:
var pirate = new Book("Pirate Cinema", "Cory Doctorow", 384);
var giver = new Book("The Giver", "Lois Lowry", 179);
var tuck = new Book("Tuck Everlasting", "Natalie Babbit", 144);

pirate.readItAll(); // You read 384 pages!
giver.readItAll(); // You read 179 pages!
tuck.readItAll(); // You read 144 pages!
Bu kod, bize birbirine benzeyen - hepsinde aynı tür özellik ve davranış vardır - ama aynı zamanda farklı olan üç kitap verir. Şahane!
Şimdi, dünyayı düşündüğümüzde, kediler ve köpekler farklı türde nesnelerdir, yani bir Cat ve birDog programlarken, bunlar için farklı nesne türleri oluşturmak isteyebilirsiniz. Bir kedi meow() der, bir köpek bark() der. Ancak, bunlar aynı zamanda benzerdir - hem kedi, hem de köpek eat() yer, ikisinin de age yaşı, birth doğumu ve death ölümü vardır. İkisi de memelidir ve bu, farklı olsalar da, birçok şeylerinin ortak olduğu anlamına gelir.
Bu durumda, nesne devralma fikrini kullanmak isteriz. Bir nesne türü, bir üst nesne türünden özellik ve davranış devralabilir, ama bununla ilgili kendi özgün şeyleri de olabilir. Tüm Cat ve Doglar Mammaldan devralabilir, böylece eat() yemeyi sıfırdan bulmaları gerekmez. JavaScript'de bunu nasıl yaparız?
Kitap örneğimize dönelim, ve Book'un "üst" nesne türü olduğunu ve bundan devralan iki nesne türü - Paperback ve EBook - olduğunu düşünelim.
Ciltsiz bir kitap, bir kitap gibidir; ama en azından programımız açısından önemli bir farkı vardır: bir kapak görüntüsü bulunur. Dolayısıyla, bu ekstra bilgi için, yapıcımızın dört argüman alması gerekir:
var PaperBack = function(title, author, numPages, cover) {
// ...
}
Şimdi, bu ilk üç argümanı hatırlamak için, Book yapıcısında yaptığımız işi yeniden yapmamız gerekmiyor - bununla ilgili kodun aynı olmasının avantajını kullanmak istiyoruz. Artık PaperBack yapıcısından Book yapıcısını çağırabiliriz ve bu argümanları geçirebiliriz:
var PaperBack = function(title, author, numPages, cover) {
Book.call(this, title, author, numPages);
// ...
};
Yine de, bu nesnede cover özelliğini saklamamız gerekir, onun için bir satıra daha ihtiyacımız olacak:
var PaperBack = function(title, author, numPages, cover) {
Book.call(this, title, author, numPages);
this.cover = cover;
};
Şimdi PaperBack için bir yapıcımız var, bu Bookla aynı özelliklere sahip olmasını sağlar, ama PaperBackin aynı zamanda yöntemleri de devralmasını istiyoruz. Programa PaperBack prototipinin Book prototipine dayalı olmasını söyleyerek, bunu şöyle yaparız:
PaperBack.prototype = Object.create(Book.prototype);
Buna ciltsize özel davranış eklemek de isteyebiliriz (örneğin yakabilmek gibi) ve bunu yapabilmek için prototipte, üstteki şu satırdan sonra fonksiyonlar tanımlayabiliriz:
PaperBack.prototype.burn = function() {
  println("Omg, you burnt all " + this.numPages + " pages");
  this.numPages = 0;
};
Artık yeni bir ciltsiz kitap yaratabilir, tamamını okuyabilir ve yakabiliriz!
var calvin = new PaperBack("The Essential Calvin & Hobbes", "Bill Watterson", 256, "http://ecx.images-amazon.com/images/I/61M41hxr0zL.jpg");

calvin.readItAll(); // You read 256 pages!
calvin.burn(); // Omg, you burnt all 256 pages!
(Aslında gerçekten de yakmayacağız, çünkü bu inanılmaz bir kitap, ancak eğer buzul bir çölde ısınmaya çalışıyorsak ve ölmek üzereysek, belki.)
Artık, programlarınız için daha karmaşık veriler oluşturmak ve program dünyalarınızı daha iyi modellemek için JavaScript'de nesne yönelimli tasarım prensiplerini nasıl kullanabileceğimizi gördünüz.

Tartışmaya katılmak ister misiniz?

Henüz gönderi yok.
İngilizce biliyor musunuz? Khan Academy'nin İngilizce sitesinde neler olduğunu görmek için buraya tıklayın.