Javascript继承

目前，我正在尝试几种不同的Javascript继承方法。我有以下代码：

（“借用”自）

现在，当我创建StreetGridView的实例时，我可以对其调用getOwnerElement（），这没有问题。一切正常

然而

当我创建另一个实例时，对实例2所做的任何更改都会反映在实例1中

我知道这是使用原型作为共享实例信息的主要问题。今天早上我绞尽脑汁，但不知道是否有人能为我指明正确的方向

谢谢

灵感来袭

我不能让这种模式工作，所以请让我知道，如果你能发现它有什么问题。但是，通过移动和使用组合继承，我似乎已经解决了这个问题

我已经包括了下面的代码，并在论坛上留下了这篇文章，以便将来帮助其他人

function GridView() {
        var _ownerElement;
    }

    GridView.prototype.getOwnerElement = function() {

        return this._ownerElement;
    }

    GridView.prototype.setOwnerElement = function(ownerElement) {
        this._ownerElement = ownerElement; 
    }

    GridView.prototype.initialize = function() {
        this.setOwnerElement('test');
    }

    function StreetGridView() {

        GridView.call(this);
    }

    StreetGridView.prototype = new GridView();

    StreetGridView.prototype.initialize = function(dataURL, ownerElement) {

        this.setOwnerElement(ownerElement);


        /* Constructor Code */

        $(this.getOwnerElement()).flexigrid
            (
                {
                    url: dataURL,
                    dataType: 'json',
                    colModel: [
                    { display: '', name: 'view', width: 20, sortable: true, align: 'center' },
                    { display: 'USRN', name: 'USRN', width: 80, sortable: true, align: 'center' },
                    { display: 'Street', name: 'Street', width: 260, sortable: true, align: 'left' },
                    { display: 'Locality', name: 'Locality', width: 200, sortable: true, align: 'left' },
                    { display: 'Town', name: 'Town', width: 200, sortable: true, align: 'left' },
                    { display: 'Open', name: 'Actions', width: 30, sortable: false, align: 'center' }
                    ],
                    sortname: "USRN",
                    sortorder: "asc",
                    usepager: true,
                    title: 'Streets',
                    useRp: true,
                    rp: 5,
                    showToggleBtn: false,
                    width: 'auto',
                    height: 'auto'
                }
            );
    }

灵感来袭

我不能让这种模式工作，所以请让我知道，如果你能发现它有什么问题。但是，通过移动和使用组合继承，我似乎已经解决了这个问题

我已经包括了下面的代码，并在论坛上留下了这篇文章，以便将来帮助其他人

function GridView() {
        var _ownerElement;
    }

    GridView.prototype.getOwnerElement = function() {

        return this._ownerElement;
    }

    GridView.prototype.setOwnerElement = function(ownerElement) {
        this._ownerElement = ownerElement; 
    }

    GridView.prototype.initialize = function() {
        this.setOwnerElement('test');
    }

    function StreetGridView() {

        GridView.call(this);
    }

    StreetGridView.prototype = new GridView();

    StreetGridView.prototype.initialize = function(dataURL, ownerElement) {

        this.setOwnerElement(ownerElement);


        /* Constructor Code */

        $(this.getOwnerElement()).flexigrid
            (
                {
                    url: dataURL,
                    dataType: 'json',
                    colModel: [
                    { display: '', name: 'view', width: 20, sortable: true, align: 'center' },
                    { display: 'USRN', name: 'USRN', width: 80, sortable: true, align: 'center' },
                    { display: 'Street', name: 'Street', width: 260, sortable: true, align: 'left' },
                    { display: 'Locality', name: 'Locality', width: 200, sortable: true, align: 'left' },
                    { display: 'Town', name: 'Town', width: 200, sortable: true, align: 'left' },
                    { display: 'Open', name: 'Actions', width: 30, sortable: false, align: 'center' }
                    ],
                    sortname: "USRN",
                    sortorder: "asc",
                    usepager: true,
                    title: 'Streets',
                    useRp: true,
                    rp: 5,
                    showToggleBtn: false,
                    width: 'auto',
                    height: 'auto'
                }
            );
    }

卓尔：

我在上面留下了一条关于使用您的解决方案调用超级构造函数两次的评论，但是对于让您继续执行inheritPrototype，我感到有点遗憾。首先，感谢Nicholas Zakas，因为这是我对其著作《面向Web开发人员的专业JavaScript》第二版（第181页）的解释：

现在替换您的：

StreetGridView.prototype = new GridView();

有,

您只调用了GridView构造函数一次！但是您会注意到对象方法。您将需要以下内容：

function object(o) {
  function F(){};
  F.prototype = o;
  return new F();
}

如果你读过道格拉斯·克罗克福德的书，你一定看过这本

无耻的插件：这东西很难理解，这正是我写一篇关于TDD JavaScript的文章的原因，整个第二部分有一系列继承模式的单元测试。我正在专门研究Zakas和Crockford关于对象创建和继承的书籍。你不必阅读我的文章（它目前是OpenOffice.odt格式），但你可能比下载我的代码并在2分钟内阅读要糟糕得多！以下是链接： 机器人：

我在上面留下了一条关于使用您的解决方案调用超级构造函数两次的评论，但是对于让您继续执行inheritPrototype，我感到有点遗憾。首先，感谢Nicholas Zakas，因为这是我对其著作《面向Web开发人员的专业JavaScript》第二版（第181页）的解释：

现在替换您的：

StreetGridView.prototype = new GridView();

有,

您只调用了GridView构造函数一次！但是您会注意到对象方法。您将需要以下内容：

function object(o) {
  function F(){};
  F.prototype = o;
  return new F();
}

如果你读过道格拉斯·克罗克福德的书，你一定看过这本

无耻的插件：这东西很难理解，这正是我写一篇关于TDD JavaScript的文章的原因，整个第二部分有一系列继承模式的单元测试。我正在专门研究Zakas和Crockford关于对象创建和继承的书籍。你不必阅读我的文章（它目前是OpenOffice.odt格式），但你可能比下载我的代码并在2分钟内阅读要糟糕得多！以下是链接：

---

我很高兴您找到了自己的解决方案，但使用jQuery ajax发布的这段代码似乎并没有解决您最初提出的继承问题。您可能需要修改原始问题，然后接受自己的答案。您应该知道您调用了两次GridView构造函数（这可能不是问题），但是如果您希望只调用一次，您可以替换您的行：StreetGridView.prototype=new GridView（）；通过调用助手方法：instatiatePrototype（subConstructor，supConstructor）…实例化prototype的实现实际上是第一篇文章的一部分；）祝你好运如果您有问题，请参阅Zakas书籍第181页！我很高兴您找到了自己的解决方案，但是使用jqueryajax发布的这段代码似乎并没有解决您最初提出的继承问题。您可能需要修改原始问题，然后接受自己的答案。您应该知道您调用了两次GridView构造函数（这可能不是问题），但是如果您希望只调用一次，您可以替换您的行：StreetGridView.prototype=new GridView（）；通过调用助手方法：instatiatePrototype（subConstructor，supConstructor）…实例化prototype的实现实际上是第一篇文章的一部分；）祝你好运如果您有问题，请参阅Zakas书籍第181页！谢谢。我已经下载了你的书，看起来不错。你有没有想过写一章关于用TDD模拟、编写UI小部件的内容？谢谢。我已经下载了你的书，看起来不错。你有没有想过写一章关于用TDD模拟、编写UI小部件的内容？回答如下：回答如下：