Apa itu warisan dalam javascript

Dalam JavaScript, pewarisan adalah mekanisme yang memungkinkan pembuatan kelas baru berdasarkan kelas yang sudah ada; pewarisan memberikan fleksibilitas untuk subkelas dan dapat menggunakan kembali metode dan variabel kelas induk rantai dan konstruktor.

Lingkungan pengoperasian tutorial ini: sistem Windows 10, JavaScript versi 1.8.5, komputer Dell G3.

Apa itu warisan dalam javascript

Warisan JavaScript adalah mekanisme yang memungkinkan kita membuat kelas baru berdasarkan kelas yang sudah ada; ini memberikan fleksibilitas bagi subkelas untuk menggunakan kembali metode dan variabel kelas induk. Proses pewarisan merupakan proses dari yang umum ke yang khusus.

Ini mempertahankan hubungan IS-A.

Kata kunci extends digunakan dalam ekspresi kelas atau deklarasi kelas.

Dengan menggunakan kata kunci extends, kita bisa mendapatkan semua properti dan perilaku objek bawaan serta kelas khusus.

Kita juga dapat mengimplementasikan pewarisan menggunakan pendekatan berbasis prototipe.

Bagaimana cara JavaScript mengimplementasikan warisan?

1. Rantai prototipe

Ide dasar: Gunakan prototipe untuk membiarkan satu tipe referensi mewarisi properti dan metode tipe referensi lain.

Hubungan antara konstruktor, prototipe, dan instance: Setiap konstruktor memiliki objek prototipe, objek prototipe berisi penunjuk ke konstruktor, dan instance berisi penunjuk internal ke objek prototipe.

Contoh pewarisan implementasi rantai prototipe:

function SuperType() {this.property = true;}SuperType.prototype.getSuperValue = function() {return this.property;}function subType() {this.property = false;}//Herited SuperTypeSubType.prototype = new SuperType ( );SubType.prototype.getSubValue = function (){return this.property;}var instance = new SubType();console.log(instance.getSuperValue());//true

2. Pinjam konstruktor

Ide dasarnya: Panggil konstruktor superkelas di dalam konstruktor subtipe, dan konstruktor dapat dieksekusi pada objek yang baru dibuat dengan menggunakan metode call() dan apply().

contoh:

function SuperType() {this.colors = ["red","blue","green"];}function SubType() {SuperType.call(this);//Mewarisi SuperType}var instance1 = new SubType(); .colors.push("black");console.log(instance1.colors);//"red","blue","green","black"var instance2 = new SubType();console.log(instance2 . warna);//"merah", "biru", "hijau"

3. Kombinasi warisan

Ide dasar: Pola pewarisan yang menggabungkan teknologi rangkaian prototipe dan peminjaman konstruktor untuk memanfaatkan yang terbaik dari kedua dunia.

contoh:

function SuperType(nama) {ini.nama = nama;ini.warna = ["merah","biru","hijau"];}SuperType.prototype.sayName = function() {console.log(nama ini); }function SubType(name, age) {SuperType.call(this,name);//Atribut yang diwarisi this.age = age;}//Metode yang diwarisi SubType.prototype = new SuperType();Subtype.prototype.constructor = Subtype; Subtipe.prototipe.sayAge = function() {console.log(this.age);}var instance1 = SubType baru("EvanChen",18);instance1.colors.push("black");consol.log(instance1. warna);//"merah","biru","hijau","hitam"instance1.sayName();//"EvanChen"instance1.sayAge();//18var instance2 = SubType baru("EvanChen666",20 );console.log(instance2.colors);//"red","blue","green"instance2.sayName();//"EvanChen666"instance2.sayAge();//20

4. Warisan prototipe

Ide dasarnya: Prototipe memungkinkan Anda membuat objek baru berdasarkan objek yang sudah ada tanpa harus membuat tipe khusus.

Ide pewarisan prototipe dapat diilustrasikan dengan fungsi berikut:

objek fungsi(o) {fungsi F(){}F.prototipe = o;kembalikan F baru();}

contoh:

var person = {nama:"EvanChen",teman:["Shelby","Pengadilan","Van"];};var anotherPerson = objek(orang);anotherPerson.name = "Greg";anotherPerson.friends.push( "Rob");var yetAnotherPerson = objek(orang);yetAnotherPerson.name = "Linda";yetAnotherPerson.friends.push("Barbie");console.log(person.friends);//"Shelby","Pengadilan" ,"Van", "Rob", "Barbie"

ECMAScript 5 membakukan pewarisan prototipe melalui metode Object.create() baru, yang menerima dua parameter: objek yang digunakan sebagai prototipe objek baru dan objek yang digunakan sebagai objek baru untuk menentukan properti tambahan.

var person = {nama:"EvanChen",teman:["Shelby","Pengadilan","Van"];};var anotherPerson = Object.create(person);anotherPerson.name = "Greg";anotherPerson.friends. push("Rob");var yetAnotherPerson = Object.create(person);yetAnotherPerson.name = "Linda";yetAnotherPerson.friends.push("Barbie");console.log(person.friends);//"Shelby" ,"Pengadilan", "Van", "Rob", "Barbie"

5. Warisan parasit

Ide dasarnya: Buat fungsi yang merangkum proses pewarisan, menyempurnakan objek dengan cara tertentu secara internal, dan mengembalikan objek seolah-olah objek tersebut benar-benar melakukan semua pekerjaan.

contoh:

function createAnother(asli) {var clone = objek(asli);clone.sayHi = function () {alert("hi");};return clone;}var person = {name:"EvanChen",teman:["Shelby ","Pengadilan","Van"];};var anotherPerson = createAnother(person);anotherPerson.sayHi();///"hi"

6. Warisan kombinatorial parasit

Ide dasarnya: mewarisi properti dengan meminjam fungsi, dan mewarisi metode melalui bentuk hibrid dari rantai prototipe

Model dasarnya adalah sebagai berikut:

functionheritProperty(subType, superType) {var prototype = objek(superType.prototype);//Membuat objek prototype.constructor = subType;//Meningkatkan objek subType.prototype = prototype;//Tentukan objek}

contoh:

function SuperType(nama){nama ini = nama;warna ini = ["merah","biru","hijau"];}SuperType.prototype.sayName = function (){alert(nama ini);}; function SubType(nama,usia){SuperType.panggilan(ini,nama);ini.usia = usia;}inheritProperty(SubTipe,SuperType);SubType.prototype.sayAge = function() {peringatan(ini.usia);}