Dalam tutorial ini, Anda akan belajar tentang warisan kelas JavaScript dengan bantuan contoh.
Warisan Kelas
Inheritance memungkinkan Anda untuk menentukan kelas yang mengambil semua fungsionalitas dari kelas induk dan memungkinkan Anda untuk menambahkan lebih banyak.
Menggunakan pewarisan kelas, kelas dapat mewarisi semua metode dan properti kelas lain.
Warisan adalah fitur berguna yang memungkinkan kode dapat digunakan kembali.
Untuk menggunakan warisan kelas, Anda menggunakan extends
kata kunci. Sebagai contoh,
// parent class class Person ( constructor(name) ( this.name = name; ) greet() ( console.log(`Hello $(this.name)`); ) ) // inheriting parent class class Student extends Person ( ) let student1 = new Student('Jack'); student1.greet();
Keluaran
Halo Jack
Dalam contoh di atas, Student
kelas mewarisi semua metode dan properti Person
kelas. Karenanya, Student
kelas sekarang akan memiliki name
properti dan greet()
metode.
Kemudian, kami mengakses greet()
metode Student
kelas dengan membuat student1
objek.
Kata kunci JavaScript super ()
Kata super
kunci yang digunakan di dalam kelas anak menunjukkan kelas induknya. Sebagai contoh,
// parent class class Person ( constructor(name) ( this.name = name; ) greet() ( console.log(`Hello $(this.name)`); ) ) // inheriting parent class class Student extends Person ( constructor(name) ( console.log("Creating student class"); // call the super class constructor and pass in the name parameter super(name); ) ) let student1 = new Student('Jack'); student1.greet();
Di sini, kelas super
dalam Student
mengacu pada Person
kelas. Oleh karena itu, ketika konstruktor Student
kelas dipanggil, ia juga memanggil konstruktor Person
kelas yang memberikan properti nama padanya.
Metode atau Properti Utama
Jika kelas anak memiliki metode atau nama properti yang sama dengan kelas induk, ia akan menggunakan metode dan properti kelas anak. Konsep ini disebut metode overriding. Sebagai contoh,
// parent class class Person ( constructor(name) ( this.name = name; this.occupation = "unemployed"; ) greet() ( console.log(`Hello $(this.name).`); ) ) // inheriting parent class class Student extends Person ( constructor(name) ( // call the super class constructor and pass in the name parameter super(name); // Overriding an occupation property this.occupation = 'Student'; ) // overriding Person's method greet() ( console.log(`Hello student $(this.name).`); console.log('occupation: ' + this.occupation); ) ) let p = new Student('Jack'); p.greet();
Keluaran
Halo siswa Jack. pekerjaan: Mahasiswa
Di sini, occupation
properti dan greet()
metode hadir di Person
kelas induk dan Student
kelas anak . Oleh karena itu, Student
kelas mengganti occupation
properti dan greet()
metode.
Penggunaan Warisan
- Karena kelas anak dapat mewarisi semua fungsi dari kelas induknya, ini memungkinkan penggunaan kembali kode.
- Setelah fungsionalitas dikembangkan, Anda dapat mewarisinya. Tidak perlu menemukan kembali roda. Ini memungkinkan kode lebih bersih dan lebih mudah dirawat.
- Karena Anda juga dapat menambahkan fungsionalitas Anda sendiri di kelas anak, Anda hanya dapat mewarisi fungsi yang berguna dan menentukan fitur lain yang diperlukan.