javascript - Regarding the inheritance method of js, please solve it!-PHP Tutorial-php.cn

javascript - Regarding the inheritance method of js, please solve it!

WBOY

Release： 2016-09-21 14:13:02

Original

887 people have browsed it

<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>

Copy after login

I saw this inheritance method in a book and said it was perfect, but I don’t think so because its superman.prototype = new person();This sentence will add the instance attributes of the parent class to the child class. On the prototype, although person.call(this, name, age); has obtained the instance attributes of the parent class, it feels like this pollutes the prototype of the subclass. How to break it?

Okay, the problem is solved, using parasitic combined inheritance can solve this problem

<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>

Copy after login

Reply content:

<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>

Copy after login

Okay, the problem is solved, using parasitic combined inheritance can solve this problem

<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>

Copy after login

Object.create(Person.prototype);

This can be effectively solved, but please pay attention to compatibility

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

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

Copy after login

Inherit person.prototype

Inherit instead of pollute