JavaScript Sınıf Miras

Sınıf mirası

Sınıf mirasını oluşturmak için aşağıdaki kullanılır: extends Anahtar kelime.

Sınıf mirasını oluşturmak için aşağıdaki kullanılır:

Örnek

Bir adı "Model" olan sınıf oluşturun, bu sınıf "Car" sınıfının yöntemlerini miras alacak:

class Car {
  constructor(brand) {
    this.carname = brand;
  }
  present() {
    return 'I have a ' + this.carname;
  }
}
class Model extends Car {
  constructor(brand, mod) {
    super(brand);
    this.model = mod;
  }
  show() {
    return this.present() + ', it is a ' + this.model;
  }
}
let myCar = new Model("Ford", "Mustang");
document.getElementById("demo").innerHTML = myCar.show();

Kişisel Deneyim

super() yöntemi çağırarak ebeveyn sınıfına atıfta bulunur.

Constructor yönteminde super() Yöntem, ebeveyn sınıfının constructor yöntemini çağırarak ebeveyn sınıfının özelliklerine ve yöntemlerine erişim izni kazandık.

Kalıtım, kodun yeniden kullanılabilirliği için çok faydalıdır: Yeni bir sınıf oluştururken mevcut sınıfın özelliklerini ve yöntemlerini yeniden kullanır.

Getter ve Setter

Class, getter ve setter kullanmanıza da izin verir.

Özellikleriniz için getter ve setter kullanmak akıllıcadır, özellikle değerleri döndürmeden veya ayarlamadan önce özel bir şey yapmak istiyorsanız.

Class'ta getter ve setter eklemek için get ve set Anahtar kelime.

Örnek

"carname" özelliği için getter ve setter oluşturun：

class Car {
  constructor(brand) {
    this.carname = brand;
  }
  get cnam() {
    return this.carname;
  }
  set cnam(x) {
    this.carname = x;
  }
}
let myCar = new Car("Ford");
document.getElementById("demo").innerHTML = myCar.cnam;

Kişisel Deneyim

Açıklama:Getter bir yöntem olsa bile, özellik değerini almak istediğinizde parantez kullanmayın。

getter/setter yönteminin adı, özellik adı ile aynı olamaz, bu örnekte carname。

Birçok programcı getter/setter'ı gerçek özelliklerden ayırmak için özellik adlarının önüne alt çizgi karakteri _ ekler：

Örnek

Getter/setter'ı gerçek özelliklerden ayırmak için alt çizgi karakteri kullanabilirsiniz：

class Car {
  constructor(brand) {
    this._carname = brand;
  }
  get carname() {
    return this._carname;
  }
  set carname(x) {}}
    this._carname = x;
  }
}
let myCar = new Car("Ford");
document.getElementById("demo").innerHTML = myCar.carname;

Kişisel Deneyim

Setter kullanmak için, parantez olmadan aynı dilbilgisiyle değer ayarlayın：

Örnek

Kullanıcı adını "Volvo" olarak değiştirmek için setter kullanın：

class Car {
  constructor(brand) {
    this._carname = brand;
  }
  get carname() {
    return this._carname;
  }
  set carname(x) {}}
    this._carname = x;
  }
}
let myCar = new Car("Ford");
myCar.carname = "Volvo";
document.getElementById("demo").innerHTML = myCar.carname;

Kişisel Deneyim

Yükseltme

Fonksiyonlar ve diğer JavaScript bildirimlerinden farklı olarak, sınıf bildirimleri yükseltme işlemi ile yapılmaz.

Bu, sınıfı önce tanımlamanız ve ardından kullanmanız gerektiği anlamına gelir:

Örnek

//Henüz bu sınıfı kullanamazsınız.
//myCar = new Car("Ford")
//Bu bir hataya neden olacaktır.
class Car {
  constructor(brand) {
    this.carname = brand;
  }
}
//Şimdi bu sınıfı kullanabilirsiniz:
let myCar = new Car("Ford")

Kişisel Deneyim

Açıklama:Açıklama: Fonksiyonlar gibi diğer JavaScript bildirimlerinden farklı olarak, sınıf bildirimleri yükseltme (bildirimleri üste taşıma) işlemi ile yapılmaz. Bu nedenle, sınıfı kullanmaya çalıştığınızda, tanımlamadan önce kullanmaya çalıştığınızda bir hata alırsınız.