Warisan Kelas JavaScript
Warisan Kelas
Untuk membuat pewarisan kelas, gunakan extends
kata kunci.
Kelas yang dibuat dengan pewarisan kelas mewarisi semua metode dari kelas lain:
Contoh
Buat kelas bernama "Model" yang akan mewarisi metode dari kelas "Mobil":
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();
Metode super()mengacu pada kelas induk.
Dengan memanggil super()metode dalam metode konstruktor, kita memanggil metode konstruktor induk dan mendapatkan akses ke properti dan metode induk.
Warisan berguna untuk penggunaan kembali kode: menggunakan kembali properti dan metode kelas yang ada saat Anda membuat kelas baru.
Getter dan Setter
Kelas juga memungkinkan Anda menggunakan getter dan setter.
Menggunakan getter dan setter untuk properti Anda dapat menjadi hal yang cerdas, terutama jika Anda ingin melakukan sesuatu yang istimewa dengan nilai tersebut sebelum mengembalikannya, atau sebelum Anda menyetelnya.
Untuk menambahkan getter dan setter di kelas, gunakan kata kunci
getand .set
Contoh
Buat pengambil dan penyetel untuk properti "carname":
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;
Catatan: meskipun pengambil adalah metode, Anda tidak menggunakan tanda kurung saat ingin mendapatkan nilai properti.
Nama metode pengambil/penyetel tidak boleh sama dengan nama properti, dalam hal ini carname.
Banyak programmer menggunakan karakter garis bawah _
sebelum nama properti untuk memisahkan pengambil/penyetel dari properti sebenarnya:
Contoh
Anda dapat menggunakan karakter garis bawah untuk memisahkan pengambil/penyetel dari properti sebenarnya:
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;
Untuk menggunakan setter , gunakan sintaks yang sama seperti saat Anda menetapkan nilai properti, tanpa tanda kurung:
Contoh
Gunakan penyetel untuk mengubah nama mobil menjadi "Volvo":
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;
Mengangkat
Tidak seperti fungsi, dan deklarasi JavaScript lainnya, deklarasi kelas tidak diangkat.
Itu berarti Anda harus mendeklarasikan sebuah kelas sebelum Anda dapat menggunakannya:
Contoh
//You cannot use the class yet.
//myCar = new Car("Ford")
//This would
raise an error.
class Car {
constructor(brand) {
this.carname = brand;
}
}
//Now you can use the class:
let myCar = new Car("Ford")
Catatan: Untuk deklarasi lain, seperti fungsi, Anda TIDAK akan mendapatkan kesalahan saat mencoba menggunakannya sebelum dideklarasikan, karena perilaku default deklarasi JavaScript adalah mengangkat (memindahkan deklarasi ke atas).