Rumah > Artikel > hujung hadapan web > Adakah javascript mempunyai warisan?
JavaScript mempunyai warisan. Warisan JavaScript ialah mekanisme yang membolehkan kami mencipta kelas baharu berdasarkan kelas sedia ada boleh memberikan fleksibiliti untuk subkelas Anda boleh menggunakan semula kaedah dan pembolehubah kelas induk, dan anda boleh menggunakan rantai prototaip dan pembina untuk mencapai warisan.
Persekitaran pengendalian tutorial ini: sistem Windows 10, versi JavaScript 1.8.5, komputer Dell G3.
Adakah JavaScript mempunyai warisan?
Warisan JavaScript ialah mekanisme yang membolehkan kami mencipta kelas baharu berdasarkan kelas sedia ada; ia memberikan kefleksibelan untuk subkelas untuk menggunakan semula kaedah dan pembolehubah kelas induk. Proses pewarisan ialah proses dari umum kepada khusus.
Bagaimana untuk melaksanakan warisan dalam JavaScript?
1. Rantaian prototaip
Idea asas: Gunakan prototaip untuk membenarkan satu jenis rujukan mewarisi sifat dan kaedah jenis rujukan yang lain.
Hubungan antara pembina, prototaip dan kejadian: Setiap pembina mempunyai objek prototaip, objek prototaip mengandungi penunjuk kepada pembina dan kejadian mengandungi penunjuk dalaman kepada objek prototaip.
Contoh pewarisan pelaksanaan rantaian prototaip:
function SuperType() { this.property = true; } SuperType.prototype.getSuperValue = function() { return this.property; } function subType() { this.property = false; } //继承了SuperType SubType.prototype = new SuperType(); SubType.prototype.getSubValue = function (){ return this.property; } var instance = new SubType(); console.log(instance.getSuperValue());//true
2 Pembina peminjam
Idea asas: panggil super dalam pembina subjenis Pembina kelas, pembina kelas. pembina boleh dilaksanakan pada objek yang baru dibuat dengan menggunakan kaedah call() dan apply().
Contoh:
function SuperType() { this.colors = ["red","blue","green"]; } function SubType() { SuperType.call(this);//继承了SuperType } var instance1 = new SubType(); instance1.colors.push("black"); console.log(instance1.colors);//"red","blue","green","black" var instance2 = new SubType(); console.log(instance2.colors);//"red","blue","green"
3. Warisan gabungan
Idea asas: menggabungkan rantai prototaip dan teknologi pembina peminjam, supaya An model warisan yang memanfaatkan yang terbaik dari kedua-dua dunia.
Contoh:
function SuperType(name) { this.name = name; this.colors = ["red","blue","green"]; } SuperType.prototype.sayName = function() { console.log(this.name); } function SubType(name, age) { SuperType.call(this,name);//继承属性 this.age = age; } //继承方法 SubType.prototype = new SuperType(); Subtype.prototype.constructor = Subtype; Subtype.prototype.sayAge = function() { console.log(this.age); } var instance1 = new SubType("EvanChen",18); instance1.colors.push("black"); consol.log(instance1.colors);//"red","blue","green","black" instance1.sayName();//"EvanChen" instance1.sayAge();//18 var instance2 = new SubType("EvanChen666",20); console.log(instance2.colors);//"red","blue","green" instance2.sayName();//"EvanChen666" instance2.sayAge();//20
4. Warisan prototaip
Idea asas: Dengan bantuan prototaip, objek baharu boleh dibuat berdasarkan sedia ada objek, dan pada masa yang sama Anda tidak perlu mencipta jenis tersuai lagi.
Idea warisan prototaip boleh digambarkan dengan fungsi berikut:
function object(o) { function F(){} F.prototype = o; return new F(); }
Contoh:
var person = { name:"EvanChen", friends:["Shelby","Court","Van"]; }; var anotherPerson = object(person); anotherPerson.name = "Greg"; anotherPerson.friends.push("Rob"); var yetAnotherPerson = object(person); yetAnotherPerson.name = "Linda"; yetAnotherPerson.friends.push("Barbie"); console.log(person.friends);//"Shelby","Court","Van","Rob","Barbie"
ECMAScript5 menyeragamkan prototaip melalui Object.create baharu () kaedah Untuk pewarisan, kaedah ini menerima dua parameter: objek untuk digunakan sebagai prototaip objek baharu dan objek untuk digunakan sebagai objek baharu untuk menentukan sifat tambahan.
var person = { name:"EvanChen", friends:["Shelby","Court","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","Court","Van","Rob","Barbie"
5. Warisan Parasit
Idea asas: Buat fungsi hanya untuk merangkum proses pewarisan, yang dipertingkatkan secara dalaman dalam beberapa cara objek, dan akhirnya kembali objek seolah-olah ia benar-benar melakukan semua kerja.
Contoh:
function createAnother(original) { var clone = object(original); clone.sayHi = function () { alert("hi"); }; return clone; } var person = { name:"EvanChen", friends:["Shelby","Court","Van"]; }; var anotherPerson = createAnother(person); anotherPerson.sayHi();///"hi"
6. Warisan gabungan parasit
Idea asas: warisi sifat dengan meminjam fungsi, dan campurkannya melalui rantai prototaip Model asas kaedah pewarisan dalam bentuk
adalah seperti berikut:
function inheritProperty(subType, superType) { var prototype = object(superType.prototype);//创建对象 prototype.constructor = subType;//增强对象 subType.prototype = prototype;//指定对象 }
Contoh:
function SuperType(name){ this.name = name; this.colors = ["red","blue","green"]; } SuperType.prototype.sayName = function (){ alert(this.name); }; function SubType(name,age){ SuperType.call(this,name); this.age = age; } inheritProperty(SubType,SuperType); SubType.prototype.sayAge = function() { alert(this.age); }
Cadangan berkaitan: tutorial pembelajaran javascript
Atas ialah kandungan terperinci Adakah javascript mempunyai warisan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!