Viewing: tr.javascript.info

Modern JavaScriptte protitipi __proto__ kullanarak ( bir nceki blmde anlatld gibi ) ayarlayabiliriz. Fakat bu daha ncesinde byle deildi.

JavaScript balangcndan beri kaltma sahipti. Bu dilin ekirdek zelliklerinden biriydi.

Fakat bunu ayarlamak iin sadece bir yol vard ve bu yol yapcda(constructor)'da "prototype" kullanmakt. Hala birok kodda bu ekilde kullanlmaktadr.

Prototip zellii

Bildiiniz gibi, new F() yeni bir obje oluturur.

new F() ile yeni bir obje yaratldnda, objenin [[Prototype]]' F.prototype a ayarlanr.

Dier bir deyile, eer F prototype zelliine sahip ve bu da obje tipine ayarlanmsa, new operatr bunu [[Prototype]] ayarlamak iin kullanr.

Aklnzda bulunsun F.prototype burada Fin sahip olduu sradan bir "prototype" objesidir. prototype terimine ok benzese de aslnda burada gerekten kullanlan sradan bir objedir.

rnein:

let animal = {
  eats: true
};

function Rabbit(name) {
  this.name = name;
}

Rabbit.prototype = animal;

let rabbit = new Rabbit("White Rabbit"); //  rabbit.__proto__ == animal

alert( rabbit.eats ); // true

Rabbit.prototype = animal szck anlamyla: Eer yeni bir Rabbit yaratlrsa new Rabbit, bunun [[Prototype]]n animala ata

Sonu u ekildedir:

[]

Grselde "prototip" yataydaki oktur, sranda bir zelliktir. [[Prototype]] ise dikeydir ve rabbitin animaldan miras aldn ifade eder.

Sradan F.prototype, yapc (contructor) zellii

Her fonksiyonun "prototype" zellii bulunmaktadr. Siz belirtmeseniz bile bu geerlidir.

Varsaylan "prototype" sadececontructor` zellii olan olan ve bu da fonksiyonun kendisini gsteren bir objedir.

u ekilde:

          function Rabbit() {}

/* varsaylan prototip
Rabbit.prototype = { constructor: Rabbit };
*/
        

[]

u ekilde kontrol edebiliriz:

function Rabbit() {}
// varsaylan:
// Rabbit.prototype = { constructor: Rabbit }

alert( Rabbit.prototype.constructor == Rabbit ); // true

Eer hibir ey yapmazsak doal olarak contructor zellii tm rabbit objelerine [[Prototype]] vastasyla iletilir.

function Rabbit() {}
// varsaylan:
// Rabbit.prototype = { constructor: Rabbit }

let rabbit = new Rabbit(); //  {constructor: Rabbit}'dan miras alr.

alert(rabbit.constructor == Rabbit); // true (prototype'tan gelir)

[]

Eer constructor zelliini kullarak varolan yapc ile ayn ekilde bir obje yapabiliriz.

u ekilde:

function Rabbit(name) {
  this.name = name;
  alert(name);
}

let rabbit = new Rabbit("White Rabbit");

let rabbit2 = new rabbit.constructor("Black Rabbit");

Bir obje var fakat bu objenin ( 3. parti ktphanelerden gelebilir) hangi yapcsnn kullanldn bilmiyorsak ve aynsn yaratmak istiyorsak olduka kullanldr.

Muhtemelen "contructor" hakkndaki en nemli ey

JavaScript "contructor" deerinin doru olduuna garanti vermez.

Evet, varsaylan "prototype" da bulunur fakat hepsi budur, sonrasndaki her ey bize aittir.

Daha zelde, eer prototipi tamamen deitirirsek, bu durumda iinde "contructor" olmayacaktr.

rnein:

function Rabbit() {}
Rabbit.prototype = {
  jumps: true
};

let rabbit = new Rabbit();
alert(rabbit.constructor === Rabbit); // false

yleyse doru "contructor"' tutmak iin varsaylan prototipe zellik ekleme/karma yoluna gidebiliriz. Tamamen zerine yazarsak varsaylan obje kaybolur.

          function Rabbit() {}

// Rabbit.prototype zerine dorudan yazma!
// sadece ekle
Rabbit.prototype.jumps = true
// varsaylan Rabbit.prototype.contructor bu ekilde korunacaktr.
        

Veya alternatif olarak, constructor zellii tekrar yaratlabilir:

          Rabbit.prototype = {
  jumps: true,
  constructor: Rabbit
};

// bu ekilde constructor doru olur, nk bunu el ile belirtmekteyiz.
        

zet

Bu blmde ksaca yapc fonksiyonlar ile oluturulan objelerin [[Prototip]]'lerinin nasl ayarlanabileceinden bahsettik. lerde bunlarn daha gelimiini programlama kalplar zerinde reneceksiniz.

Her ey aslnda ok basit, birka cmle ile daha net anlatmak gerekirse:

F.prototype zellii [[Prototype]] ile ayn deildir. F.prototype aslnda new F() arldnda [[Prototype]]' ayarlar.
F.prototype deeri ya obje ya da null olmaldr: dier deerler almaz.
"prototype" zellii sadece bir yapc fonksiyona ayarland ve new ile arldnda zel etkisi olur.

Normal objeler prototypen ayr bir nemi yoktur:

          let user = {
  name: "John",
  prototype: "Bla-bla" // hibir bys yok
};
        

Varsaylan durumda tm fonksiyonlar F.prototype = { constructor: F} eklinde tanmldr, bundan dolay, bir objenin yapcsna "constructor" zellii ile eriilebilir.

Grevler

"prototype"'i deitirme

Aadaki kodda new Rabbitile yeni bir Rabbit oluturulmu sonra prototype deitirilmeye allmtr.

Balangta aadaki koda sahibiz:

function Rabbit() {}
Rabbit.prototype = {
  eats: true
};

let rabbit = new Rabbit();

alert( rabbit.eats ); // true

Bir tane daha karakter dizisi ekledik, alert ne gsterir?

          function Rabbit() {}
Rabbit.prototype = {
  eats: true
};

let rabbit = new Rabbit();

Rabbit.prototype = {};

alert( rabbit.eats ); // ?
        

Eer kod aadaki gibi deitirilirse ne olur ( bir satr deitirildi )?

          function Rabbit() {}
Rabbit.prototype = {
  eats: true
};

let rabbit = new Rabbit();

Rabbit.prototype.eats = false;

alert( rabbit.eats ); // ?
        

Ya byle ? ( bir satr deitirildi )

          function Rabbit() {}
Rabbit.prototype = {
  eats: true
};

let rabbit = new Rabbit();

delete rabbit.eats;

alert( rabbit.eats ); // ?
        

Son ekli:

          function Rabbit() {}
Rabbit.prototype = {
  eats: true
};

let rabbit = new Rabbit();

delete Rabbit.prototype.eats;

alert( rabbit.eats ); // ?
        

Cevaplar:

true.

Rabbit.prototype atamas [[Prototype]]'I ayarlasada bu yeni objelerde etki eder. Var olanlarda bir deiiklie neden olmaz.
false.

Objeler referanslar ile atanr. Rabbit.prototypetan alnan obje kopya deildir, hala hem Rabbit.prototype hem de rabbitin [[Prototype]]' tarafndan referans edilir.

Bundan dolay referans edilen herhangi bir yerden ieriik deiirse bu dierini de etkiler.
true.

Tm delete operasyonlar objeye dorudan etki eder. Mesela delete rabbit.eats rabbitten eats zelliini silmeye alr fakat yapaz. Bundan dolay bu operasyonun hibir etkisi olayacaktr.
undefined.

eats prototipten silindiinden dolay artk bir etkisi olmayacaktr.

Create an object with the same constructor

Imagine, we have an arbitrary object obj, created by a constructor function we dont know which one, but wed like to create a new object using it.

Can we do it like that?

let obj2 = new obj.constructor();

Give an example of a constructor function for obj which lets such code work right. And an example that makes it work wrong.

We can use such approach if we are sure that "constructor" property has the correct value.

For instance, if we dont touch the default "prototype", then this code works for sure:

function User(name) {
  this.name = name;
}

let user = new User('John');
let user2 = new user.constructor('Pete');

alert( user2.name ); // Pete (worked!)

It worked, because User.prototype.constructor == User.

But if someone, so to say, overwrites User.prototype and forgets to recreate "constructor", then it would fail.

For instance:

function User(name) {
  this.name = name;
}
User.prototype = {}; // (*)

let user = new User('John');
let user2 = new user.constructor('Pete');

alert( user2.name ); // undefined

Why user2.name is undefined?

Heres how new user.constructor('Pete') works:

First, it looks for constructor in user. Nothing.
Then it follows the prototype chain. The prototype of user is User.prototype, and it also has nothing.
The value of User.prototype is a plain object {}, its prototype is Object.prototype. And there is Object.prototype.constructor == Object. So it is used.

At the end, we have let user2 = new Object('Pete'). The built-in Object constructor ignores arguments, it always creates an empty object thats what we have in user2 after all.

Yorumlar

yorum yapmadan nce ltfen okuyun...

Eer gelitirme ile alakal bir neriniz var ise yorum yerine github konusu gnderiniz.
Eer makalede bir yeri anlamadysanz ltfen belirtiniz.
Koda birka satr eklemek iin <code> kullannz, birka satr eklemek iin ise <pre> kullann. Eer 10 satrdan fazla kod ekleyecekseniz plnkr kullanabilirsiniz)

F.prototype