├── .gitattributes ├── .github └── FUNDING.yml ├── README.md ├── Sorular ├── 01_Cikti_Nedir │ ├── README.md │ └── app.js ├── 02-Cikti_Nedir │ ├── README.md │ └── app.js ├── 03-Cikti_Nedir │ ├── README.md │ └── app.js ├── 04_Cikti_Nedir │ ├── README.md │ └── app.js ├── 05_Hangisi_Dogru │ ├── README.md │ └── app.js ├── 06-Cikti_Nedir │ ├── README.md │ └── app.js ├── 07_Cikti_Nedir │ ├── README.md │ └── app.js ├── 08_Cikti_Nedir │ ├── README.md │ └── app.js ├── 09_Cikti_Nedir │ ├── README.md │ └── app.js ├── 10-Cikti_Nedir │ ├── README.md │ └── app.js └── 11_Cikti_Nedir │ ├── README.md │ └── app.js └── desktop.ini /.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | -------------------------------------------------------------------------------- /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | # These are supported funding model platforms 2 | 3 | github: ozantekin 4 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 |

JavaScript Question List

2 |

3 | This is a translated version of the JavaScript Questions repository created by software engineer Lydia Hallie. It includes links to short video explanations for each question and collected resources. 4 |

5 | 6 | - :clapper: I will release video explanations for at least two questions each week on my YouTube channel. 7 | - :pencil: I will also note summaries of the preparation work done while creating these videos. 8 | 9 |
10 | 11 |

Table of Contents

12 | 13 | | Question | Video Series | Study Notes | Status | 14 | | :-------- | :------------------------------------------------ | :------------------------------------------------------------------------------------- | :----------- | 15 | | `01` | **[What is the Output-1?](https://youtu.be/GSVvqtEa2MY)** | ***[What is Hoisting?](https://github.com/ozantekin/javascript-sorular/tree/main/Sorular/01_Cikti_Nedir)*** | `Completed` | 16 | | `02` | **[What is the Output-2?](https://youtu.be/tBYI4-t_vcY)** | ***[Var vs Let and setTimeout Usage](https://github.com/ozantekin/javascript-sorular/tree/main/Sorular/02-Cikti_Nedir)*** | `Completed` | 17 | | `03` | **[What is the Output-3?](https://youtu.be/x6sLesK6Tvo)** | ***[Arrow Function, Scope](https://github.com/ozantekin/javascript-sorular/tree/main/Sorular/03-Cikti_Nedir)*** | `Completed` | 18 | | `04` | **[What is the Output-4?](https://www.youtube.com/watch?v=YxUubV1gcvg&ab_channel=OzanTekin)** | ***[What are Truthy and Falsy Values?](https://github.com/ozantekin/javascript-sorular/tree/main/Sorular/04_Cikti_Nedir)*** | `Completed` | 19 | | `05` | **[Which is Correct?](https://www.youtube.com/watch?v=ZIqVzSf3zY0&ab_channel=OzanTekin)** | ***[Usage of Square Brackets](https://github.com/ozantekin/javascript-sorular/tree/main/Sorular/05_Hangisi_Dogru)*** | `Completed` | 20 | | `06` | **[What is the Output-5?](https://youtu.be/YF3w553Uo-Q)** | ***[Variable Communication with Reference](https://github.com/ozantekin/javascript-sorular/tree/main/Sorular/06-Cikti_Nedir)*** | `Completed` | 21 | | `07` | **[What is the Output-6?](https://www.youtube.com/watch?v=uZ8X7U_BLl4&ab_channel=OzanTekin)** | ***[What are new Number, double equals, and triple equals?](https://github.com/ozantekin/javascript-sorular/tree/main/Sorular/07_Cikti_Nedir)*** | `Completed` | 22 | | `08` | **[What is the Output-7?](https://youtu.be/_MNmSIG7JA0)** | ***[What is a Class Static?](https://github.com/ozantekin/javascript-sorular/tree/main/Sorular/08_Cikti_Nedir)*** | `Completed` | 23 | | `09` | **[What is the Output-8?](https://youtu.be/igInuHXJruE)** | ***[What is Use Strict?](https://github.com/ozantekin/javascript-sorular/tree/main/Sorular/09_Cikti_Nedir)*** | `Completed` | 24 | | `10` | **[What is the Output-9?](https://youtu.be/J8zGz77l4NE)** | ***[What are Prototype and Constructor?](https://github.com/ozantekin/javascript-sorular/tree/main/Sorular/10-Cikti_Nedir)*** | `Completed` | 25 | -------------------------------------------------------------------------------- /Sorular/01_Cikti_Nedir/README.md: -------------------------------------------------------------------------------- 1 | ###### 1. Çıktı Nedir? 2 | 3 | ```javascript 4 | function sayHi() { 5 | console.log(name); 6 | console.log(age); 7 | 8 | var name = 'Ozan'; 9 | let age = 21; 10 | } 11 | sayHi(); 12 | ``` 13 | 14 | - A: `Ozan` and `undefined` 15 | - B: `Ozan` and `ReferenceError` 16 | - C: `ReferenceError` and `22` 17 | - D: `undefined` and `ReferenceError` 18 | 19 |
Cevap 20 |

21 | 22 | ##### Cevap: D 23 | ###### Sorunun çözüm videosu için tıkla. 24 |

25 | 26 | 27 |

Notlarım

28 | 29 | 30 | - Hoisting, Interpreter'ın önce tanımlanan şey hakkında hafızada yer açması anlamına gelir. 31 | - Var anahtar kelimesi ile tanımladığımız name değişkenini gördü ama yukarı taşınmadığı için tanımlayamadı o yüzden `undefined` aldık. Çünkü tanımlandığı satır gelene kadar bir değere sahip olamaz. Yani elimizde bir adresin var ama bu adresin boş olduğunu söyler. 32 | - Let ve const anahtar kelimeleri için ise hoisting uygulanır ancak değer ataması yapılmaz. Değişken tanımladığımız satırden önce erişilebilir değildir. Buna temporal dead zone yani geçiçi ölü bölge de denir. Bu yüzden `ReferenceError` alırız. -------------------------------------------------------------------------------- /Sorular/01_Cikti_Nedir/app.js: -------------------------------------------------------------------------------- 1 | function sayHi(){ 2 | var name = "Ozan"; 3 | let age = 22; 4 | 5 | console.log(name); 6 | console.log(age); 7 | } 8 | 9 | sayHi(); -------------------------------------------------------------------------------- /Sorular/02-Cikti_Nedir/README.md: -------------------------------------------------------------------------------- 1 | ###### 2. Çıktı Nedir? 2 | 3 | ```javascript 4 | for (var i = 0; i < 3; i++) { 5 | setTimeout(() => console.log(i), 1); 6 | } 7 | for (let i = 0; i < 3; i++) { 8 | setTimeout(() => console.log(i), 1); 9 | } 10 | ``` 11 | 12 | - A: `0 1 2` and `0 1 2` 13 | - B: `0 1 2` and `3 3 3` 14 | - C: `3 3 3` and `0 1 2` 15 | 16 |
Cevap 17 |

18 | 19 | #### Cevap: C 20 | 21 | ###### Sorunun çözüm videosu için tıkla. 22 | 23 |

24 |
25 | 26 |

Notlarım

27 | 28 | 29 | - `Var` bir global scope'tur. Var ile tüm döngü yinelemelerimiz için yalnızca bir paylaşılan bağlama sahip oluruz. 30 | - Yani, her `setTimeout` geri çağrısındaki i, döngü yinelemesi sona erdikten sonra hepsini 3'e eşit olan aynı değişken haline getirmeye çalışacaktır. 31 | - `Let` ise bir blok scope'tur ve for döngüsünde kullanıldığında her yineleme için yeni bir bağlam elde edersiniz. 32 | - Yani her `setTimeout` geri çağrısındaki i, her biri farklı bir değere sahip olan farklı bir değişken haline getirmeye çalışacaktır. -------------------------------------------------------------------------------- /Sorular/02-Cikti_Nedir/app.js: -------------------------------------------------------------------------------- 1 | for (var i=0; i<3; i++){ 2 | setTimeout(()=> console.log(i),1); 3 | } 4 | //3,3,3 5 | 6 | for (let i=0; i<3; i++){ 7 | setTimeout(()=>console.log(i),1); 8 | } 9 | //0,1,2 -------------------------------------------------------------------------------- /Sorular/03-Cikti_Nedir/README.md: -------------------------------------------------------------------------------- 1 | ###### 3. Çıktı Nedir? 2 | 3 | ```javascript 4 | const shape = { 5 | radius:10, 6 | diameter(){ 7 | return this.radius * 2; 8 | }, 9 | perimeter: () => 2*Math.PI * this.radius 10 | }; 11 | 12 | console.log(shape.diameter()); 13 | console.log(shape.perimeter()); 14 | ``` 15 | 16 | - A: `20` and `62.83185307179586` 17 | - B: `20` and `NaN` 18 | - C: `20` and `63` 19 | - D: `NaN` and `63` 20 | 21 |
Cevap 22 |

23 | 24 | #### Cevap: B 25 | 26 | ###### Sorunun çözüm videosu için tıkla. 27 | 28 |

29 |
30 | 31 |

Notlarım

32 | 33 | 34 | - `diameter` sıradan bir fonksiyon `perimeter` ise arrow fonksiyon dikkat edelim bu noktaya. 35 | - Arrow fonksiyonlarda, `this` anahtar kelimesi sıradan fonksiyonların aksine kendi kapsama alanı olan scope'u referans alır. Bu da demek oluyor ki `perimeter`'i çağırdığımız zaman `shape` objesini değil kendi kapsama alanını yani scope'unu referans alacaktır (örneğin window). 36 | - Yani perimeter arrow function olduğu için kapsama alanı içinde `radius` değeri yoktur o yüzden `undefined` alıyoruz. 37 | - Özet: `perimeter` içinde Arrow Function kullanılmış dikkat! Arrow fonksiyon için kendi kapsama alanı yani scope'u önemlidir. -------------------------------------------------------------------------------- /Sorular/03-Cikti_Nedir/app.js: -------------------------------------------------------------------------------- 1 | const shape = { 2 | radius:10, 3 | diameter(){ 4 | return this.radius * 2; 5 | }, 6 | perimeter: () => 2*Math.PI * this.radius 7 | }; 8 | 9 | console.log(shape.diameter()); 10 | console.log(shape.perimeter()); -------------------------------------------------------------------------------- /Sorular/04_Cikti_Nedir/README.md: -------------------------------------------------------------------------------- 1 | ###### 4. Çıktı Nedir? 2 | 3 | ```javascript 4 | 5 | console.log(+true); 6 | 7 | console.log(!"Ozan"); 8 | 9 | ``` 10 | 11 | - A: `1` and `false` 12 | - B: `false` and `NaN` 13 | - C: `false` and `false` 14 | 15 |
Cevap 16 |

17 | 18 | #### Cevap: A 19 | 20 | ###### Sorunun çözüm videosu için tıkla. 21 | 22 |

23 |
24 | 25 |

Notlarım

26 | 27 | 28 | - `+`, işlemeye çalıştığı değişkeni sayıya çevirmeye çalışır. Bu yüzden true'yu bir sayıya çevirir. True ve false matematiksel değerleri `true` = 1 ve `false` = 0 dır. 29 | - Şimdi gelelim Ozan'a `"Ozan"` truthy bir değerdir. `Truthy` ise şu anlama gelir; JavaScript'te true'ya denk olan ve falsy olmayan her değerdir. Buradan yola çıkarsak `!"Ozan"` ile şu soru sorulur aslında bu `Bu truthy değer falsy mi?` bu soruya cevap olarak false çıktsını alırız. 30 | 31 | Hatırlatma: 32 | - `True` = 1 33 | - `False` = 0 34 | - `Truthy`: JavaScript'te true'ya denk olan ve falsy olmayan her değer. 35 | - `Falsy`: Yanlış olarak değerlendirebilecek değerler. 36 | - Flasy değerler: `Boolean false`, `Boş string`, `undefined`, `null`, `NaN (Not a number)`, `Nümerik 0 ya da 0 sonucunu veren bir işlem`. 37 | - Truthy ise bu kapsam içinde olmayan diğer değerlerdir. 38 | 39 | -------------------------------------------------------------------------------- /Sorular/04_Cikti_Nedir/app.js: -------------------------------------------------------------------------------- 1 | console.log(+true); 2 | console.log(!"Ozan"); -------------------------------------------------------------------------------- /Sorular/05_Hangisi_Dogru/README.md: -------------------------------------------------------------------------------- 1 | ###### 5. Hangisi Doğrudur? 2 | 3 | ```javascript 4 | 5 | const bird = { 6 | size: "small" 7 | }; 8 | 9 | const mosue = { 10 | name: "Mickey", 11 | small: true 12 | }; 13 | 14 | console.log(mouse[bird.size]); 15 | console.log(mouse[bird["size"]]); 16 | console.log(mouse.bird.size); 17 | 18 | ``` 19 | 20 | - A: `mouse.bird.size` geçerli değil. 21 | - B: `mouse[bird.size]` geçerli değil. 22 | - C: `mouse[bird["size"]]` geçerli değil. 23 | - D: Bütün şıklar geçerli değildir. 24 | 25 |
Cevap 26 |

27 | 28 | #### Cevap: A 29 | 30 | ###### Sorunun çözüm videosu için tıkla. 31 | 32 |

33 |
34 | 35 |

Notlarım

36 | 37 | 38 | - İlk başta doğru şıkları açıklamayla başlayalım: 39 | - Köşeli ayraç gösterimini kullandığımızda açılış ayracı `[` ve kapanış ayracını bulana kadar `]` işlem devam eder. Bulduğu zaman ifadeyi değerlendirir. 40 | - B: `mouse[bird.size]` => Önce `small` olan `bird.size` değerini değerlendirir. Sonra `mosue["small"]` `true` değerini döndürür. C şıkkı için de bu geçerlidir. 41 | - Şimdi yanlış şıkkımızı açıklayalım: 42 | - Nokta ( `.` ) gösterimi ile bu adımları yapamayız. Çünkü `mouse` 'un `bird` adında bir key'i yok, bu da `mouse.bird`'ü `undefined` olarak tanımlamasına neden olur. Bunun ardından `mouse.bird.size` ile yani az önce yaptığımız işleme ek olarak yine nokta gösterimini kullanarak `size` soruyuruz. `mouse.bird` ile `undefined` aldığımızı söylemiştik `mouse.bird.size` ile aslında `undefined.size` sormuş oluyoruz. Bu da geçerli olmayan bir ifadedir. O yüzden bize `undefined` öğesinin `size` özelliği okunamıyor gibi bir hata verir. 43 | - Hatırlatma: 44 | - JavaScript'te tüm object key'ler symbol olmadıkları müddetçe string'tir. 45 | - Key'leri string olarak yazmamış olsak bile arka planda string'e çevrilir. -------------------------------------------------------------------------------- /Sorular/05_Hangisi_Dogru/app.js: -------------------------------------------------------------------------------- 1 | const bird = { 2 | size: "small" 3 | }; 4 | 5 | const mouse = { 6 | name:"Mickey", 7 | small: true 8 | }; 9 | 10 | console.log(mouse[bird.size]); 11 | console.log(mouse[bird["size"]]); 12 | console.log(mouse.bird.size); 13 | 14 | -------------------------------------------------------------------------------- /Sorular/06-Cikti_Nedir/README.md: -------------------------------------------------------------------------------- 1 | ###### 6. Çıktı Nedir? 2 | 3 | ```javascript 4 | 5 | let c = { greeting: "Hey!" }; 6 | let d; 7 | 8 | d=c; 9 | c.greeting = "Hello"; 10 | console.log(d.greeting); 11 | 12 | ``` 13 | 14 | - A: `Hello` 15 | - B: `Hey!` 16 | - C: `undefined` 17 | - D: `ReferenceError` 18 | - E: `TypeError` 19 | 20 |
Cevap 21 |

22 | 23 | #### Cevap: A 24 | 25 | ###### Sorunun çözüm videosu için tıkla. 26 | 27 |

28 |
29 | 30 |

Notlarım

31 | 32 | 33 | - JavaScript'te tüm object'ler birbirine eşit olarak ayarlanır. Bunlara reference yoluyla iletişime geçebiliriz. 34 | - 1.işlem, `c` değişkeni bir object'in değerini tuttuğunu görüyoruz. 35 | - 2.işlem, `c` değişkenini referansla `d` değişkeni olarak gösteriyoruz. Yani bu da demek oluyor ki `c` değişkenine yapacağımız her işlem `d` değişkenini de etkliyor. 36 | - 3.işlem, ise `c.greeting ='Hello'` oluyor. Yani `greeting: 'Hey!'` `greeting:'Hello'` olarak değiştiriyoruz. 37 | - Son, 2.işlemde dediğimiz gibi `c` değişkenine yapılan işlemler `d` değişkenini de etkiliyordu. O yüzden `console.log(d.greeting);` yazdığımız zaman alacağımız çıktı 3.işlemde gerçekleşen işlem ile Hello olacaktır. 38 | -------------------------------------------------------------------------------- /Sorular/06-Cikti_Nedir/app.js: -------------------------------------------------------------------------------- 1 | let c = {greeting: "Hey!"}; 2 | let d; 3 | 4 | d = c; 5 | c.greeting = "Hello"; 6 | console.log(d.greeting); 7 | -------------------------------------------------------------------------------- /Sorular/07_Cikti_Nedir/README.md: -------------------------------------------------------------------------------- 1 | ###### 7. Çıktı Nedir? 2 | 3 | ```javascript 4 | 5 | let a = 3; 6 | let b = new Number(3); 7 | let c = 3; 8 | 9 | console.log(a == b); 10 | console.log(a === b); 11 | console.log(b === c); 12 | 13 | ``` 14 | 15 | - A: `true` `flase` `true` 16 | - B: `flase` `flase` `true` 17 | - C: `true` `flase` `flase` 18 | - D: `flase` `true` `true` 19 | 20 |
Cevap 21 |

22 | 23 | #### Cevap: C 24 | 25 | ###### Sorunun çözüm videosu için tıkla. 26 | 27 |

28 |
29 | 30 |

Notlarım

31 | 32 | 33 | - `new Number()` yerleşik bir fonksiyon yapıcıdır. Bir sayı gibi görünsede bir sayı değildir. 34 | - `new Number()` => Bir sürü ekstra özelliği vardır ve bir object'tir. Yeni wrapper object oluşturur. 35 | - `a == b` Her ikisinin de 3 değerine sahip olduğunu gördü ve `true` çıktısını almamızı sağladı. 36 | - `a === b` ise `false` çıktısını verdi bize çünkü değer olarak 3 olabilirler ama tür olarak `new Number()` number değil bir object. 37 | - `b === c` için de `a === b` de söylediğimiz aynı şeyler geçerlidir. 38 | - Hatırlatma: 39 | - `Number()` => Argümanı bir sayı değerine dönüştürür. Bunun yerine plus kullanabilirdik. örnek olarak `+x` te kullanılabiliriz. 40 | - `==` operatörünü kullandığımız zaman sadece aynı değere sahip olup olmadığına bakılır. 41 | - `===` operatörünü kullandığımız zaman hem aynı değere hem de aynı türe sahip olup olmadığına bakar. -------------------------------------------------------------------------------- /Sorular/07_Cikti_Nedir/app.js: -------------------------------------------------------------------------------- 1 | let a = 3; 2 | let b = new Number(3); 3 | let c = 3; 4 | 5 | console.log(a == b); 6 | console.log(a === b); 7 | console.log(b === c); -------------------------------------------------------------------------------- /Sorular/08_Cikti_Nedir/README.md: -------------------------------------------------------------------------------- 1 | ###### 8. Çıktı Nedir? 2 | 3 | ```javascript 4 | 5 | class Chameleon { 6 | static colorChange(newColor) { 7 | this.newColor = newColor; 8 | return this.newColor; 9 | } 10 | 11 | constructor( {newColor = 'green' } = {}) { 12 | this.newColor = newColor; 13 | } 14 | } 15 | 16 | const osman = new Chameleon({ newColor: 'purple' }); 17 | console.log(osman.colorChange('orange')); 18 | 19 | ``` 20 | 21 | - A: `true` 22 | - B: `purple` 23 | - C: `green` 24 | - D: `TypeError` 25 | 26 |
Cevap 27 |

28 | 29 | #### Cevap: D 30 | 31 | ###### Sorunun çözüm videosu için tıkla. 32 | 33 |

34 |
35 | 36 |

Notlarım

37 | 38 | 39 | - `colorChange` fonksiyonu statiktir. 40 | - Statik yöntemler yalnızca oluşturuldukları constructor içinde kullanılabilirler ve herhangi bir alt öğeye aktarılmazlar veya class örneklerine çağrılmazlar. 41 | - `osman`, 'Chameleon' class'ının bir örneği olduğundan fonksiyon buna çağrılamaz. Bu yüzden `TypeError` alırız. 42 | - Hatırlatma: 43 | - Static metotlar ES6 ile gelen özelliklerden biridir. 44 | - ES5 ile bir class içindeki metot ya da özelliklere ulaşmak istiyorsak new classAdı() şeklinde yeni bir sınıf örneği oluşturup bu sınıf örneği üzerinden istediğimiz özelliklere ulaşabiliyorduk. 45 | - Static metotlar bize new anahtar kelimesini kullanmadan `sınıfAdı.ozellik` şeklinde objesiz ulaşabilme imkanı sağlar. -------------------------------------------------------------------------------- /Sorular/08_Cikti_Nedir/app.js: -------------------------------------------------------------------------------- 1 | class Chameleon { 2 | static colorChange(newColor) { 3 | this.newColor = newColor; 4 | return this.newColor; 5 | } 6 | 7 | constructor( {newColor = 'green' } = {}) { 8 | this.newColor = newColor; 9 | } 10 | } 11 | 12 | const osman = new Chameleon({ newColor: 'purple' }); 13 | console.log(osman.colorChange('orange')); 14 | -------------------------------------------------------------------------------- /Sorular/09_Cikti_Nedir/README.md: -------------------------------------------------------------------------------- 1 | ###### 9. Çıktı Nedir? 2 | 3 | ```javascript 4 | 5 | let merhaba; 6 | merhaab = {}; // yazım hatası! 7 | console.log(merhaab); 8 | 9 | ``` 10 | 11 | - A: `{}` 12 | - B: `ReferenceError: greetign is not defined` 13 | - C: `undefined` 14 | 15 |
Cevap 16 |

17 | 18 | #### Cevap: A 19 | 20 | ###### Sorunun çözüm videosu için tıkla. 21 | 22 |

23 |
24 | 25 |

Notlarım

26 | 27 | 28 | - Nesneyi log'a kaydeder çünkü global nesne üzerinden boş bir nesne oluşturduk. 29 | - `merhaba`'ı `merhaab` olarak yanlış yazdık fark ettiyseniz. JavaScript yorumlayıcısı bunu `global.merhaab = {}` olarak görür veya `window.merhaab = {}` olarak görür. 30 | - Bu tarz hatalardan kaçınmak için `use strict` kullanılabilir. 31 | - `"use strict";`, bir değişkene herhangi bir atama yapmadan önce tanımlanıp tanımlanmadığına bakar. Tanımlanmamışsa hata almamızı sağlar. 32 | - `use strict` hakkında daha detaylı bilgi sahibi olmak isterseniz bu yazımı okuyabilirsiniz. -------------------------------------------------------------------------------- /Sorular/09_Cikti_Nedir/app.js: -------------------------------------------------------------------------------- 1 | let merhaba; 2 | merhaab = {}; // yazım hatası! 3 | console.log(merhaab); -------------------------------------------------------------------------------- /Sorular/10-Cikti_Nedir/README.md: -------------------------------------------------------------------------------- 1 | ###### 10. Çıktı Nedir? 2 | 3 | ```javascript 4 | 5 | function Person(firstName, lastName) { 6 | this.firstName = firstName; 7 | this.lastName = lastName; 8 | } 9 | 10 | const member = new Person("Lydia", "Hallie"); 11 | Person.getFullName = function() { 12 | return `${this.firstName} ${this.lastName}`; 13 | }; 14 | 15 | console.log(member.getFullName()); 16 | 17 | ``` 18 | 19 | - A: `TypeError` 20 | - B: `SyntaxError` 21 | - C: `Ozan Tekin` 22 | - D: `undefined` `undefined` 23 | 24 |
Cevap 25 |

26 | 27 | #### Cevap: A 28 | 29 | ###### Sorunun çözüm videosu için tıkla. 30 | 31 |

32 |
33 | 34 |

Notlarım

35 | 36 | 37 | - Sıradan function'larla yaptığımız gibi bir yapıcıya yani `constructor `'a özellik ekleyemeyiz. 38 | - Eğer tek seferde tüm nesnelere özellik eklemek istersek `prototype` kullanmamız gerekir. 39 | 40 | ```javascript 41 | 42 | Person.prototype.getFullName = function() { 43 | return `${this.firstName} ${this.lastName}`; 44 | }; 45 | 46 | console.log(member.getFullName()); 47 | 48 | ``` 49 | 50 | - Bu durumda `member.getFullName()` çalışmış olacak. 51 | 52 | - Hatırlatma: 53 | - Constructor: Object'in yani nesnenin oluşturduğu yapıcı metoda erişmek için kullanılan özelliktir. 54 | - Prototype: Javascript’te Inheritance’ın (kalıtımın) temelini oluşturmaktadır. Inheritance var olan class’ları kullanarak, yeni class’lar tanımlanmasına olanak sağlamaktadır. 55 | -------------------------------------------------------------------------------- /Sorular/10-Cikti_Nedir/app.js: -------------------------------------------------------------------------------- 1 | function Person(firstName, lastName) { 2 | this.firstName = firstName; 3 | this.lastName = lastName; 4 | } 5 | 6 | const member = new Person("Ozan", "Tekin"); 7 | Person.getFullName = function() { 8 | return `${this.firstName} ${this.lastName}`; 9 | }; 10 | 11 | console.log(member.getFullName()); 12 | 13 | /* 14 | 15 | Person.prototype.getFullName = function() { 16 | return `${this.firstName} ${this.lastName}`; 17 | }; 18 | 19 | */ -------------------------------------------------------------------------------- /Sorular/11_Cikti_Nedir/README.md: -------------------------------------------------------------------------------- 1 | ###### 11. Çıktı Nedir? 2 | 3 | ```javascript 4 | 5 | function Person(firstName, lastName) { 6 | this.firstName = firstName; 7 | this.lastName = lastName; 8 | } 9 | 10 | const ozan = new Person("Ozan", "Tekin"); 11 | const nida = Person("Nida", "Tekin"); 12 | 13 | console.log(ozan); 14 | console.log(nida); 15 | 16 | ``` 17 | 18 | - A: `Person {firstName: "Ozan", lastName: "Tekin"}` ve `undefined` 19 | - B: `Person {firstName: "Ozan", lastName: "Tekin"}` ve `Person {firstName: "Nida", lastName: "Tekin"}` 20 | - C: `Person {firstName: "Ozan", lastName: "Tekin"}` ve `{}` 21 | - D:`Person {firstName: "Ozan", lastName: "Tekin"}` ve `ReferenceError` 22 | 23 |
Cevap 24 |

25 | 26 | #### Cevap: A 27 | 28 | ###### Sorunun çözüm videosu için tıkla. 29 | 30 |

31 |
32 | 33 |

Notlarım

34 | 35 | 36 | - Dikkat ederseniz `nida` için `new` anahtar kelimesini kullanmadık. 37 | - `new` anahtar kelimesini kullandığımız zaman oluşturduğumuz yeni boş nesneyi gösterir ve içini doldurur. 38 | - Eğer `new` eklenmezse global nesneyi referans gösterir. 39 | - Yukarıda `this.firstName` tanımladık ve `Nida`'ya eşitledik sonra `this.lastName` tanımladık ve `Tekin`'e eşitledik. Ama `new` anahtar kelimesini kullanmadığımız için JavaScript yorumlayıcısı bunları böyle tanımladı: `global.firstName = "Nida"` ve `global.lastName = "Tekin"` şeklinde tanımladı. O yüzden `nida` `undefined` olarak tanımlandı. 40 | 41 | Hatırlatma Köşesi: 42 | - `new` anahtar kelimesi constructor fonksiyonu olan bir object'in instance'sini yani örneğini oluşturmak için kullanılır. 43 | - Constructor bir fonksiyon `new` anahtar kelimesi ile çağrıldığında aşağıdaki eylemler gerçekleşir: 44 | - Yeni bir boş object oluşturur. 45 | - Yeni nesnenin prototip özelliğini constructor fonksiyonun prototipiyle aynı şekilde ayarlar. 46 | - This değişkeni, yeni oluşturulan nesneye işaret edecek şekilde ayarlanır. This anahtar kelimesi ile oluşturulan ile bildirilen özelliği yeni nesneye bağlar. 47 | - Constructor fonksiyon primitive olamayan bir değer döndürdüğünde yeni oluşturulan bir nesne döndürülür. 48 | - Constructor fonksiyon primitive bir değer döndürürse yok sayılır. 49 | - Fonksiyon gövdesinde herhangi bi geri dönüş ifadesi (return) yoksa fonksiyonun sonunda this döndürülür. 50 | -------------------------------------------------------------------------------- /Sorular/11_Cikti_Nedir/app.js: -------------------------------------------------------------------------------- 1 | function Person(firstName, lastName) { 2 | this.firstName = firstName; 3 | this.lastName = lastName; 4 | } 5 | 6 | const ozan = new Person("Ozan", "Tekin"); 7 | const nida = Person("Nida", "Tekin"); 8 | 9 | console.log(ozan); 10 | console.log(nida); -------------------------------------------------------------------------------- /desktop.ini: -------------------------------------------------------------------------------- 1 | [.ShellClassInfo] 2 | IconResource=C:\WINDOWS\System32\SHELL32.dll,115 3 | [ViewState] 4 | Mode= 5 | Vid= 6 | FolderType=Generic 7 | --------------------------------------------------------------------------------