我想用另一个原型(prototype)扩展一个原型(prototype)。这是我当前的代码,也尝试了不同的东西,但我无法让它工作。
Network.prototype 是一个空对象,为什么?
function Tester() {}
Tester.prototype = {
clazz: 'Tester',
start: function (url) {}
};
function NetworkTester() {}
NetworkTester.prototype = {
clazz: 'NetworkTester',
test: function (url) {
this.start(); // this is undefined
}
};
var helpers = {
extend2: function (ChildClass, ParentClass) {
ChildClass.prototype = new ParentClass();
ChildClass.prototype.constructor = ChildClass;
}
};
helpers.extend2(NetworkTester, Tester);
console.log(NetworkTester.prototype);
我不想编写这样的 NetoworkTester 代码:
NetworkTester.prototype.clazz = 'NetworkTester';
NetworkTester.prototype.test = function (url) {
this.start(); // this is undefined
};
我想要它,因为我有它,它更漂亮。
最佳答案
为什么会发生这种情况?
因为您要使用以下行覆盖 .prototype
属性:
ChildClass.prototype = new ParentClass();
由 new ParentClass();
创建的对象是一个没有任何自己属性的对象(因为您没有在 Tester
的构造函数中分配任何属性),因此它在开发工具中显示为空对象。
NetworkTester.prototype
的内部[[Prototype]]
插槽已设置。您可以使用 Object.getPrototypeOf
查看它。方法:
Object.getPrototypeOf(NetworkTester.prototype)
如何解决这个问题?
要解决您的困境,您必须扭转代码顺序:
为子对象的
.prototype
属性创建新对象,将其链接到父对象:helpers.extend2(NetworkTester, Tester);
定义子项的
.prototype
属性:NetworkTester.prototype.x = ...; NetworkTester.prototype.y = ...;
为了避免父级不必要的构造函数调用,您可能应该使用 Object.create
而不是 new
运算符。
所以你的代码将如下所示:
var helpers = {
extend2: function (ChildClass, ParentClass) {
ChildClass.prototype = Object.create(ParentClass.prototype);
ChildClass.prototype.constructor = ChildClass;
}
};
function Tester() {}
Tester.prototype = {
clazz: 'Tester',
start: function (url) {}
};
function NetworkTester() {}
// This needs to happen before you assign to NetworkTester.prototype
helpers.extend2(NetworkTester, Tester);
NetworkTester.prototype.clazz = 'NetworkTester';
NetworkTester.prototype.test = function (url) {
this.start(); // this is undefined
};
console.log(NetworkTester.prototype);
关于javascript - 用另一个原型(prototype)扩展原型(prototype),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34355656/