如何获得子构造函数的名称？

Question

I have a class with prototype method printConstructorName which prints the name of the constructor:

function Parent(){
}

Parent.prototype.printConstructorName = function(){
   console.log(this.constructor.name);
};

var parent = new Parent();
parent.printConstructorName(); // It gets 'Parent'.

A class Child inherits the Parent through the prototype:

function Child()
{
}

Child.prototype = Parent.prototype;

var child = new Child();
child.printConstructorName(); // It gets 'Parent', but 'Child' is necessary.

How to get the name of Child's constructor through the Parent's prototype method?

Answer 1

Working fiddle

The inheritance pattern is the problem. Here's the quick fix:

function inherits(childCtor, parentCtor) {
  function tempCtor() {};
  tempCtor.prototype = parentCtor.prototype;
  childCtor.prototype = new tempCtor();
  childCtor.prototype.constructor = childCtor;
};

function Parent(){}

Parent.prototype.printConstructorName = function(){
   return this.constructor.name;
};

var parent = new Parent();
console.log(parent.printConstructorName()); // It gets 'Parent'.

function Child() {
    Parent.call(this);
};
inherits(Child, Parent);

var child = new Child();
console.log(child.printConstructorName()); // It gets 'Child'.

Answer 2

You are assigning the Parent s prototype object to Child.prototype - which means that every child instance inherits from the same thing as all parent instances, and of course they inherit the same constructor property that way.

Instead, create a new object for the Child.prototype , inheriting from the Parent.prototype , and you can overwrite the constructor property then:

Child.prototype = Object.create(Parent.prototype, {
    constructor: {value: Child, configurable: true}
});

Answer 3

Your inheritance mechanism is clearly wrong. The way you've done it, if you add a property to Child.prototype, all Parent objects will also get it...

You might want an inherit function something like this:

inherit = (function() {
    function F() {};
    return function(parent, child) {
        F.prototype = parent.prototype;
        child.prototype = new F();
        child.prototype.constructor = child;
    };
}());

which you can then use this way:

function Parent() {
}

Parent.prototype.printConstructorName = function(){
   console.log(this.constructor.name);
};

var parent = new Parent();
parent.printConstructorName();  // Parent

function Child() {
}

inherit(Parent, Child);

var child = new Child(); // Child
child.printConstructorName();

Answer 4

When you're extending an existing constructor, you should set the child prototype to an instance of the parent class, so that changes to the child prototype don't affect the parent prototype.

Then you can simply override the constructor such that it points to the correct function.

function Parent() {
    ....code...
}

Parent.prototype.printConstructorName = function () {
    console.log(this.constructor.name);
};

function Child() {
    ...code...
}

Child.prototype = new Parent();
Child.prototype.constructor = Child;

p = new Parent();
p.printConstructorName(); //Parent

c = new Child();
c.printConstructorName(); //Child

Answer 5

Write an extend function, something like:

__extend = function(child, sup) {
    for (prop in sup.prototype) {
        child.prototype[prop] = sup.prototype[prop];
    };
};

And then you call it instead of doing the prototype = new parent trick - like:

var Parent = function() {}
Parent.prototype.name = function() { return "name" };

var Child = function() {}
__extend(Child, Parent);

Check out this fiddle: http://jsfiddle.net/Cmg4A/

Answer 6

也许您应该在Child：D中覆盖printConstructorName。