javascript - Bitte lösen Sie die Vererbungsmethode von js!

WBOY
Freigeben: 2016-09-21 14:13:02
Original
863 Leute haben es durchsucht

<code>function person(name,age){
    this.name = name;
    this.age = age;
}
person.prototype.say = function(){
    console.log(this.name+":"+this.age);
}

function superman(name,age){
    person.call(this,name,age);
}
superman.prototype = new person();

var s = new superman('superman',29);
</code>
Nach dem Login kopieren
Nach dem Login kopieren

Ich habe diese Vererbungsmethode in einem Buch gesehen und sie soll perfekt sein, aber ich glaube nicht, weil sein Satz superman.prototype = new person(); die Instanzattribute der übergeordneten Klasse zum Prototyp der untergeordneten Klasse hinzufügt. Obwohl person.call(this,name,age);Ich habe die Instanzattribute der übergeordneten Klasse erhalten, habe aber das Gefühl, dass dies den Prototyp der Unterklasse verunreinigt.

Okay, das Problem ist gelöst, die Verwendung einer parasitären kombinierten Vererbung kann dieses Problem lösen

<code>function object(obj){
 function F(){}
 F.prototype = obj;
 return new F();
}

function inheritProtoType(SuperType,SubType){
     var prototype = object(SuperType.prototype);
     prototype.constructor = SubType;
     SubType.prototype = prototype;
}

function SuperType(){
    this.name = 'yuhualingfeng';
    this.friends = ['David','Bob','Lucy'];
}
SuperType.prototype.saySuperName = function(){
    console.log(this.name);
};

function SubType(){
    SuperType.call(this);
    this.age = 30;
}
inheritProtoType(SuperType,SubType);

SubType.prototype.saySubName = function(){
    console.log(this.name);
};

var subType = new SubType();
</code>
Nach dem Login kopieren
Nach dem Login kopieren

Antwortinhalt:

<code>function person(name,age){
    this.name = name;
    this.age = age;
}
person.prototype.say = function(){
    console.log(this.name+":"+this.age);
}

function superman(name,age){
    person.call(this,name,age);
}
superman.prototype = new person();

var s = new superman('superman',29);
</code>
Nach dem Login kopieren
Nach dem Login kopieren

Ich habe diese Vererbungsmethode in einem Buch gesehen und sie soll perfekt sein, aber ich glaube nicht, weil sein Satz superman.prototype = new person(); die Instanzattribute der übergeordneten Klasse zum Prototyp der untergeordneten Klasse hinzufügt. Obwohl person.call(this,name,age);Ich habe die Instanzattribute der übergeordneten Klasse erhalten, habe aber das Gefühl, dass dies den Prototyp der Unterklasse verunreinigt.

Okay, das Problem ist gelöst, die Verwendung einer parasitären kombinierten Vererbung kann dieses Problem lösen

<code>function object(obj){
 function F(){}
 F.prototype = obj;
 return new F();
}

function inheritProtoType(SuperType,SubType){
     var prototype = object(SuperType.prototype);
     prototype.constructor = SubType;
     SubType.prototype = prototype;
}

function SuperType(){
    this.name = 'yuhualingfeng';
    this.friends = ['David','Bob','Lucy'];
}
SuperType.prototype.saySuperName = function(){
    console.log(this.name);
};

function SubType(){
    SuperType.call(this);
    this.age = 30;
}
inheritProtoType(SuperType,SubType);

SubType.prototype.saySubName = function(){
    console.log(this.name);
};

var subType = new SubType();
</code>
Nach dem Login kopieren
Nach dem Login kopieren

Object.create(Person.prototype);

Dies kann effektiv gelöst werden, aber achten Sie bitte auf die Kompatibilität

<code>function create(obj) {
    if (Object.create) {
        return Object.create(obj);
    }

    function f() {};
    f.prototype = obj;
    return new f();
}</code>
Nach dem Login kopieren

Erbt person.prototype

Erben statt verschmutzen

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!