简体   繁体   English

在javascript中继承和使用超类的构造函数

[英]Inherit and use super class's constructor in javascript

I wonder if it's possible to instantiate subclasses in javascript by automatically using the super class's constructor. 我想知道是否可以通过自动使用超类的构造函数在javascript中实例化子类。
Consider this (inspired by this other question here on SO ): 考虑一下这一点(受到SO上另一个问题的启发):

function A(prop) {
    this.prop = prop;
}
A.prototype.whatAmI = function() {
    console.log(
        "I'm an instance of %s, my prop is %s",
        this instanceof A1? "A1" : "A2",
        this.prop
    );
};

function A1() {
    A.apply(this, arguments);
}
A1.prototype = new A();
A1.prototype.constructor = A1;

function A2() {
    A.apply(this, arguments);
}
A2.prototype = new A();
A2.prototype.constructor = A2;

var a1 = new A1("foo").whatAmI(); //I'm an instance of A1, my prop is foo
var a2 = new A2("bar").whatAmI(); //I'm an instance of A2, my prop is bar

However, referring to this article , in the first example I came across this line of code: 但是,参考本文 ,在第一个示例中,我遇到了以下代码行:

Cat.prototype.constructor = Cat;
//Otherwise instances of Cat would have a constructor of Mammal

I thought that's exactly what I needed: that instances of A1 and A2 have the constructor of A . 我想这就是我需要的到底是什么:是的情况下, A1A2具有的构造A Unfortunately commenting out A1.prototype.constructor = A1 and emptying A1 's body (same goes for A2 ) does not work: 不幸的是,注释掉A1.prototype.constructor = A1并清空A1的主体(对A2相同)无效:

function A1() {}
A1.prototype = new A();

function A2() {}
A2.prototype = new A();

var a1 = new A1("foo").whatAmI(); //I'm an instance of A1, my prop is undefined
var a2 = new A2("bar").whatAmI(); //I'm an instance of A2, my prop is undefined

Finally, changing A 's constructor to use the arguments object instead of explicitly passing prop has no effect either: 最后,更改A的构造函数以使用arguments对象而不是显式传递prop也无效:

function A() {
    this.prop = arguments[0];
}

Is it even possible, with a little fiddling around with the prototype property, to achieve what I want? 稍微摆弄prototype属性,是否有可能实现我想要的?

 Cat.prototype.constructor = Cat; //Otherwise instances of Cat would have a constructor of Mammal 

I thought that's exactly what I needed: that instances of A1 and A2 have the constructor of A. 我认为这正是我所需要的:A1和A2的实例具有A的构造函数。

No, that's not what they meant. 不,那不是他们的意思。 The A1 and A2 functions are still their own constructors that are getting invoked, and you cannot change that. A1A2的功能仍然自己的构造函数越来越调用,你不能改变的。

The problem that the article describes is that the .constructor property that all instances inherit to point out their constructor is no longer valid when you overwrite A X .prototype . 本文介绍的问题是,当您覆盖A X .prototype时,所有实例都继承以指出其构造函数.constructor属性不再有效。 See also What is the `constructor` property really used for? 另请参阅`constructor`属性的真正用途是什么? (and linked questions). (和链接的问题)。

Unfortunately commenting out A1.prototype.constructor = A1 and emptying A1's body (same goes for A2) does not work. 不幸的是,注释掉A1.prototype.constructor = A1并清空A1的主体(对A2相同)无效。

By emptying the body, it doesn't do anything any more. 通过排空身体,它不再起作用。 You still will need to call A explicitly, you won't get around that. 您仍然需要显式调用A ,您将无法解决该问题。 What you could do is create a generic factory that creates subclasses for A that don't do anything special, but I don't think it's worth it. 您可以做的是创建一个通用工厂,该工厂为A创建子类,但没有做任何特殊的事情,但我认为这样做不值得。

Oh, and not to forget: You should not use new for creating prototypes ! 哦,不要忘记: 您不应该使用new来创建原型

subclass(parent) {
    function Child() {
        parent.apply(this, arguments);
    }
    Child.prototype = Object.create(parent.prototype);
    Child.prototype.constructor = Child;
    return Child;
}

function A(prop) {
    this.prop = prop;
}
A.prototype.whatAmI = function() {
    console.log(
        "I'm an instance of %s, my prop is %s",
        this instanceof A1? "A1" : "A2",
        this.prop
    );
};
var A1 = subclass(A),
    A2 = subclass(A);

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM