Rumah  >  Artikel  >  hujung hadapan web  >  Adakah javascript mempunyai warisan?

Adakah javascript mempunyai warisan?

WBOY
WBOYasal
2022-04-08 10:21:381898semak imbas

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.

Adakah javascript mempunyai warisan?

Persekitaran pengendalian tutorial ini: sistem Windows 10, versi JavaScript 1.8.5, komputer Dell G3.

Adakah JavaScript mempunyai warisan?

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!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn