Pewarisan Kelas JavaScript

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 extendskata 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, Studentkelas mewarisi semua metode dan properti Personkelas. Karenanya, Studentkelas sekarang akan memiliki nameproperti dan greet()metode.

Kemudian, kami mengakses greet()metode Studentkelas dengan membuat student1objek.

Kata kunci JavaScript super ()

Kata superkunci 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 superdalam Studentmengacu pada Personkelas. Oleh karena itu, ketika konstruktor Studentkelas dipanggil, ia juga memanggil konstruktor Personkelas 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, occupationproperti dan greet()metode hadir di Personkelas induk dan Studentkelas anak . Oleh karena itu, Studentkelas mengganti occupationproperti 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.

Artikel yang menarik...