Javascript面向对象的应用结构答案

【问题标题】：Javascript object-oriented application structureJavascript面向对象的应用结构
【发布时间】：2014-06-26 11:58:16
【问题描述】：

我正在尝试以更面向对象的方式重写 JS Web 应用程序。

假设我有一个名为 Application 的主对象：

var Application = (function(obj) {

    obj.init = function() {
        console.log("Application init");
    };
    obj.move = function() {
        return {
            left: function() { console.log("Move left"); },
            right: function() { console.log("Move right"); }
        }
    }

    return obj;

})(Application || {});

我想添加另一个可能有多个实例的方法，所以我需要添加一个原型：（这发生在另一个文件中）

var Application = (function(obj) {

    obj.child = function() {
        return {
            typeA: function() {
                console.log("New child object of type A");
                this.childID = Math.floor((Math.random() * 10) + 1); // Just a random number
            },
            typeB: function() {
                console.log("New child object of type B");
                this.childID = Math.floor((Math.random() * 10) + 1); // Just a random number
            }
        }
        // This is where it goes wrong
        obj.child.typeA.prototype = function() {
            getID: function() { console.log(this.childID) }
        }
    };

    return obj;

})(Application || {});

我的问题是我无法访问 getID 的原型函数 typeA()。这可能是因为我构建应用程序的方式。我希望能够像这样调用原型方法：

var a = Application.child.typeA();
a.getID();

如何以适当的方式为这样的对象添加原型？

我是面向对象 Javascript 的新手，因为在 JS 中构建面向对象的应用程序有很多方法，所以我很确定我把它们搞砸了。

【问题讨论】：

这个问题似乎是题外话，因为它是关于正在工作的代码；也许 codereview.stackexchange.com 会是这个问题的更好位置。
问题中的代码不起作用。我在问两个问题：如何使代码工作以及如果代码可以工作，这是否是一个好习惯。
通过添加对未来访问者有用的问题陈述来帮助我们。 “此代码不起作用”不会帮助遇到您问题的人。在这里提出问题的每个人都会这样做，因为他们的代码不起作用。有什么不好的？它不应该做什么？你看到什么行为？您期望看到什么行为？将此编辑到您的问题中；并改进您的标题，使其反映您的代码的实际问题。就问“两个问题”而言，这有点像一个愚蠢的问题 - 将其缩小到一个问题。
我已经编辑了这个问题，以便更清楚地说明问题和问题。
更多关于构造函数和原型可以在这里找到：stackoverflow.com/a/16063711/1641941

标签： javascript oop javascript-objects module-pattern

【解决方案1】：

我在这里做错了什么？

child 是一个返回对象的函数，您似乎想让它成为对象本身。此外，它在原型分配完成之前完成了return。并且原型“对象”本身是对象字面量和函数之间的句法混合。

改为使用

var Application = (function(obj) {

    obj.child = {
        typeA: function() {
            console.log("New child object of type A");
            this.childID = Math.floor((Math.random() * 10) + 1); // Just a random number
        },
        typeB: function() {
            console.log("New child object of type B");
            this.childID = Math.floor((Math.random() * 10) + 1); // Just a random number
        }
    };
    obj.child.typeA.prototype.getID = function() {
         console.log(this.childID)
    };

    return obj;
})(Application || {});

您也可以直接将对象字面量分配给.prototype，但that is not recommended 过度修改现有对象。

我构建应用程序的方式是一种好的做法吗？

是的，这是一种常见的模式。

【讨论】：