未调用Javascript prototype.constructor

我不熟悉

Javascript

面向对象编程

。我需要编写一个

JS

类

，它可以

继承

。完整的类可以继承。无论何时

文档

准备就绪，它都会被调用

我正以以下方式尝试：

alert('reached');
var Hello = new VeerWidget();

function VeerWidget(){}

VeerWidget.prototype.constructor = function()
{
    $(document).ready(function(){
        alert('called');
    });
}

我在

xyz.js

我所期望的是：一旦页面加载，调用带有REACH的

popup

，然后调用带有REACH的

popup

但这是行不通的<调用代码>弹出窗口和已到达。不管叫什么，都不叫

但是，当我尝试这种方式时：

alert('reached');
var Hello = new VeerWidget();

function VeerWidget()
{
    $(document).ready(function(){
        alert('called');
    });
}

---

一切顺利。但是我需要继承

VeerWidget

。如何做到这一点。？

您遇到的问题是，这一行并不像您认为的那样：

VeerWidget.prototype.constructor = function()

它所做的是为所有实例都可见的属性设置一个值

实例的构造函数实际上是VeerWidget函数，无论您做什么，它都不会改变，因此您的代码应该如下所示：

alert('reached');
var Hello = new VeerWidget();

function VeerWidget(){
    $(document).ready(function(){
        alert('called');
    });
}

function InheritingWidget() {
    VeerWidget.call(this);
}

InheritingWidget.prototype = Object.create(VeerWidget.prototype);
InheritingWidget.prototype.constructor = InheritingWidget;

var inheritingHello = new InheritingWidget();

VeerWidget.prototype.constructor = function(parent) {
    var message = parent.getMessage();
    $(document).ready(function(){
       alert(message);
    });
}

function VeerWidget()
{
    this.getMessage = function() {return 'called';};
    if(typeof this.__proto__.constructor === 'function') this.__proto__.constructor(this);
}

至于继承，我不完全确定您想要的是什么，但它可能是这样的：

alert('reached');
var Hello = new VeerWidget();

function VeerWidget(){
    $(document).ready(function(){
        alert('called');
    });
}

function InheritingWidget() {
    VeerWidget.call(this);
}

InheritingWidget.prototype = Object.create(VeerWidget.prototype);
InheritingWidget.prototype.constructor = InheritingWidget;

var inheritingHello = new InheritingWidget();

VeerWidget.prototype.constructor = function(parent) {
    var message = parent.getMessage();
    $(document).ready(function(){
       alert(message);
    });
}

function VeerWidget()
{
    this.getMessage = function() {return 'called';};
    if(typeof this.__proto__.constructor === 'function') this.__proto__.constructor(this);
}

---

只需在主构造函数末尾添加以下行，即可执行prototype的构造函数函数：

if(typeof this.__proto__.constructor === 'function') this.__proto__.constructor();

最终结果将是：

VeerWidget.prototype.constructor = function(parent) {
    var message = parent.getMessage();
    $(document).ready(function(){
       alert(message);
    });
}

alert('reached');
var Hello = new VeerWidget();

function VeerWidget()
{
    if(typeof this.__proto__.constructor === 'function') this.__proto__.constructor();
}

---

注意：您可以通过传递父函数来访问其方法，如下所示：

alert('reached');
var Hello = new VeerWidget();

function VeerWidget(){
    $(document).ready(function(){
        alert('called');
    });
}

function InheritingWidget() {
    VeerWidget.call(this);
}

InheritingWidget.prototype = Object.create(VeerWidget.prototype);
InheritingWidget.prototype.constructor = InheritingWidget;

var inheritingHello = new InheritingWidget();

VeerWidget.prototype.constructor = function(parent) {
    var message = parent.getMessage();
    $(document).ready(function(){
       alert(message);
    });
}

function VeerWidget()
{
    this.getMessage = function() {return 'called';};
    if(typeof this.__proto__.constructor === 'function') this.__proto__.constructor(this);
}

---

如果你想知道为什么javascript变量“highting”不能像你期望的那样工作，那么就研究一下它。改变顺序。您正在启动

Hello

，然后设置构造函数。首先定义需要在VeerWidget上定义的所有内容，然后instances@rambocoder：它不起作用的原因与提升无关。@FelixKling:是的，但查找它的建议很好，因为这是第二个示例起作用的原因：-）