B扩展了A，但B.add填充了A.prototype.property

B extends A, but B.add populates A.prototype.property

本文关键字：prototype property 填充 扩展 add      更新时间：2023-09-26

我有一个类和另一个类从第一个继承属性子。

function A() {}
A.prototype.children = [];
function B() {}
B.prototype = new A();
B.prototype.addChild = function(Child) {
    this.children.push(Child);
};
var b = new B();
b.addChild(new Object());

奇怪的是，当将b转储到控制台时，.children中没有项(如果属性.children存在;Chrome/Firefox)，但其原型的.children属性被填充。为什么呢?

在脚本中只创建了一个子数组，但由于继承，它被每个实例(甚至B的原型)引用。当你推到它时，你也会看到来自各处的更改。

相反，给每个实例一个自己的数组:

function A() {
    this.children = [];
}

并且，不要为所有B实例创建一个数组来继承new A -相反，使用

function B() {
    A.call(this); // do everything the A constructor does on this instance
}
B.prototype = Object.create(A.prototype);
B.prototype.addChild = function(Child) {
    this.children.push(Child);
};

您不应该使用原型来存储属于实例的数据。当你这样做的时候。如果B中没有子节点，则原型链继续到A。正如@Bergi所建议的，你应该删除:

B.prototype = new A

尝试定义:

function A() {
  this.children = [];
}
A.prototype.addChild = function (o) { this.children.push(o)};
var b = new A();
b.addChild({});

相关文章：