JavaScript'te Sınıflar

Bu makale, JavaScript'teki sınıfları açıklar.

YouTube Video

JavaScript'te Sınıflar

JavaScript'te bir sınıf, nesne yönelimli programlama kavramını içerir ve nesneler için bir şablon görevi görür. Sınıflar ile bir nesnenin özelliklerini ve yöntemlerini özet bir şekilde tanımlayabilir, yeniden kullanılabilirliği ve kod düzenini geliştirebilirsiniz. Sınıf sözdizimi JavaScript'e ES6 ile tanıtıldı.

Sınıf Tanımı

Bir sınıf class anahtar kelimesi ile tanımlanır ve genellikle constructor adı verilen bir yöntemle başlatılır.

 1class Person {
 2    // Constructor method (called when the class is instantiated)
 3    constructor(name, age) {
 4        this.name = name; // Property definition
 5        this.age = age;
 6    }
 7
 8    // Method definition
 9    greet() {
10        return `Hello, my name is ${this.name}`;
11    }
12}
13
14// Instantiation of the class
15const alice = new Person("Alice", 25);
16console.log(alice.greet()); // Hello, my name is Alice

• class Person ile bir sınıf tanımlarız.
• constructor, bir nesne oluşturulduğunda otomatik olarak çağrılan özel bir yöntemdir.
• this anahtar kelimesi, sınıf içindeki sınıfın bir örneğine (nesne) atıfta bulunur.

Sınıf Özellikleri ve Yöntemleri

Bir sınıf özellikler ve yöntemler tanımlayabilir. Özellikler, bir nesnenin niteliklerini temsil eder; yöntemler ise sahip olduğu fonksiyonları temsil eder.

 1class Car {
 2    constructor(brand, model) {
 3        this.brand = brand;
 4        this.model = model;
 5    }
 6
 7    // Method definition
 8    drive() {
 9        console.log(`Driving a ${this.brand} ${this.model}`);
10    }
11}
12
13const car1 = new Car("Toyota", "Corolla");
14car1.drive(); // Driving a Toyota Corolla

Bu örnekte, bir Car sınıfı brand ve model özellikleri ile bir drive yöntemi ile tanımlanır.

Sınıf Mirası

Sınıflar diğer sınıflardan miras alabilir. Miras kullanarak mevcut bir sınıfa dayalı yeni bir sınıf oluşturabilir ve ona ek işlevsellik ekleyebilirsiniz.

 1class Animal {
 2    constructor(name) {
 3        this.name = name;
 4    }
 5
 6    speak() {
 7        console.log(`${this.name} makes a noise`);
 8    }
 9}
10
11// Inherit from the Animal class
12class Dog extends Animal {
13    constructor(name, breed) {
14        super(name); // Call the constructor of the parent class (Animal)
15        this.breed = breed;
16    }
17
18    // Override the method
19    speak() {
20        console.log(`${this.name} barks`);
21    }
22}
23
24const dog = new Dog("Rex", "German Shepherd");
25dog.speak(); // Rex barks

Bu örnekte, Dog sınıfı Animal sınıfından miras alır.

• extends anahtar kelimesi Animal sınıfından miras almak için kullanılır.
• Dog sınıfının constructor'ında, üst sınıfın constructor'ını çağırmak için super() kullanılır. Bu, üst sınıfın başlatma sürecini miras almanıza olanak tanır.
• Miras alınan sınıf içinde, üst sınıfın yöntemlerini geçersiz kılabilirsiniz. Bu örnekte, "Rex makes a noise" yerine, "Rex barks" görüntülenir.

Statik Yöntemler

Bir sınıf içinde bir statik yöntem tanımladığınızda, yöntem doğrudan sınıfın kendisine atanır. Statik yöntemler, örneklem oluşturulmadan çağrılabilir.

1class MathUtils {
2    // Static method
3    static add(a, b) {
4        return a + b;
5    }
6}
7
8console.log(MathUtils.add(5, 10)); // 15

Bu örnekte, MathUtils sınıfında add adında bir statik yöntem tanımlanmıştır.

• static anahtar kelimesi, bir statik yöntemi tanımlamak için kullanılır.
• Statik yöntemler, sınıf örneklerine ait değildir ve doğrudan sınıfın kendisinden çağrılabilir.

Getter ve Setter

Bir sınıfta getter ve setter tanımlayarak özelliklerin alınmasını ve ayarlanmasını kapsülleyebilirsiniz.

 1class Rectangle {
 2    constructor(width, height) {
 3        this.width = width;
 4        this.height = height;
 5    }
 6
 7    // Getter
 8    get area() {
 9        return this.width * this.height;
10    }
11
12    // Setter
13    set widthValue(newWidth) {
14        this.width = newWidth;
15    }
16}
17
18const rect = new Rectangle(10, 20);
19console.log(rect.area); // 200
20
21rect.widthValue = 15;
22console.log(rect.area); // 300

Bu örnekte, Rectangle sınıfı area adında bir getter ve widthValue adında bir setter tanımlar.

• Getter (get), bir özelliğin değerini alırken çağrılır.
• Setter (set), bir özelliğin değerini ayarlarken çağrılır.

Sınıf Sözdizimi Kısayolu

JavaScript'te sınıf sözdizimi dahili olarak konstrüktör fonksiyonları ve prototipler kullanılarak uygulanır. Sınıf sözdizimi, bunları daha kısa bir şekilde yazmayı sağlayan bir sözdizimi kolaylığıdır.

 1// Example without using class syntax
 2function Person(name, age) {
 3    this.name = name;
 4    this.age = age;
 5}
 6
 7Person.prototype.greet = function() {
 8    return `Hello, my name is ${this.name}`;
 9};
10
11const person = new Person("Alice", 25);
12console.log(person.greet()); // Hello, my name is Alice

Bu örnekte, bir Person konstrüktör fonksiyonu tanımlanır ve greet yöntemi bir prototip kullanılarak tanımlanır.

this ile Çalışma

Bir sınıfın içindeki this anahtar kelimesi, o sınıfın örneğine işaret eder. Ancak, sınıf yöntemlerinde this ile çalışırken, davranışının kapsama bağlı olarak değişebileceğini bilmelisiniz. Özellikle yöntemleri geri çağırım fonksiyonları olarak kullanırken sorunlar ortaya çıkabilir.

 1class Counter {
 2    constructor() {
 3        this.count = 0;
 4    }
 5
 6    increment() {
 7        this.count++;
 8        console.log(this.count);
 9    }
10}
11
12const counter = new Counter();
13setTimeout(counter.increment, 1000); // NaN
14// NaN, since this.count is undefined, it becomes NaN after incrementing.

Bu tür durumlarda, setTimeout'a geri çağırım olarak geçirildiğinde, thisin işaret ettiği referans değişebilir. Bu sorunu önlemek için bind yöntemini kullanarak thisi sabitlemek veya ok fonksiyonlarını kullanmak önerilir.

 1class Counter {
 2    constructor() {
 3        this.count = 0;
 4    }
 5
 6    increment() {
 7        this.count++;
 8        console.log(this.count);
 9    }
10}
11
12const counter = new Counter();
13
14// When using bind
15setTimeout(counter.increment.bind(counter), 1000);
16
17// When using an arrow function
18setTimeout(() => counter.increment(), 2000);

Özet

• Sınıflar, nesneler oluşturmak, özellikler ve yöntemler tanımlamak için bir şablon olarak kullanılır.
• Nesne yönelimli kavramları kullanarak bir sınıfı genişletmek için kalıtım kullanabilirsiniz.
• Statik yöntemler, sınıfın kendisine ait olup, bir örnek oluşturmadan kullanılabilir.
• Özellikleri getter ve setter kullanarak kapsülleyebilirsiniz.
• JavaScript'in sınıf sözdizimi bir sözdizimi şekeridir ve dahili olarak prototipe dayalı kalıtımı kullanır.

Sınıfları kullanarak nesne yönelimli programlamayı daha doğal bir şekilde ele alabilir ve kodun tekrar kullanılabilirliğini ve sürdürülebilirliğini artırabilirsiniz.

Yukarıdaki makaleyi, YouTube kanalımızda Visual Studio Code'u kullanarak takip edebilirsiniz. Lütfen YouTube kanalını da kontrol edin.

YouTube Video