Question

我已经编写JS一段时间了，但我从未做过任何面向对象的事情。我通常只是在顶部定义了所有变量，然后只使用它们。我一直听到一遍又一遍地使用OO，但现在我不能做我想做的事情，我无法得到任何帮助。

这是一个小提琴，以及半相同的代码：

var App = {
    options: {

        /* ------------------------------------
             Options (PREFERABLY DONT CHANGE)
        --------------------------------------- */

        baseDomain     : 'google.com',
        apiVersion     : '/api/v1'

    },
    state: {

        current: App.options.baseDomain + App.options.apiVersion

    }
}

所以做App.options.baseDomain（或this.options.baseDomain）对我不起作用。如果我不能基于它们定义其他应用程序级别值，那么定义应用程序级别变量的用处是什么？我知道这是一个模糊的问题，但我真的不知道我在问什么......我只是遇到了一个问题，我只能通过一堆变量来完成，而不仅仅是设置，而是状态在我的应用程序中，凭借我对Javascript OO模式的了解并不那么容易.... 编辑：好的，这是我想要做的事情：

http://i.imgur.com/ak5YD.png

但是我并没有意识到这些限制......所以我需要一种解决方法，尽可能贴近这个实现。

Answer 1

您可以将您的方法视为创建名为App的“实例”对象。

这是一种略有不同的方法。

function App () {
    // Save a reference to the object
    var that = this;

    that.options = {
        baseDomain: "google.com",
        apiVersion: "/api/v1"
    };

    that.state = {
        current: that.options.baseDomain + that.options.apiVersion
    };
}

var myApp = new App();
// Write the current state to the screen
document.write(myApp.state.current);

这是JSFiddle：http://jsfiddle.net/zDeAJ/1/

希望这有帮助！

Answer 2

您可以执行以下操作（在JavaScript中，函数是对象）：

function App () {
    // Save a reference to the object
    this.options = {
        baseDomain: "google.com",
        apiVersion: "/api/v1"
    };

    this.state = {
        current: this.options.baseDomain + this.options.apiVersion
    };
}

var myApp = new App();
console.log(myApp);

Answer 3

你的问题很通用;你应该更加具体地了解你想要实现的目标。

除此之外，请阅读有关对象的文档;

取自w3schools:

使用JavaScript，您可以定义和创建自己的对象。

创建新对象有两种不同的方法：
1. Define and create a direct instance of an object.
2. Use a function to define an object, then create new object instances.

方式1：

personObj=new Object();
personObj.firstname="John";
personObj.lastname="Doe";
personObj.age=50;
personObj.eyecolor="blue";

方式2：

function person(firstname,lastname,age,eyecolor)
{
    this.firstname=firstname;
    this.lastname=lastname;
    this.age=age;
    this.eyecolor=eyecolor;

    this.changeName=changeName;
    function changeName(name) {
        this.lastname=name;
    }
}

Answer 4

JavaScript是一种解释型语言。这意味着您的代码将从内到外进行评估，或者评估最内层的表达式并将其传递给下一个外部表达式。

在您的示例中，首先评估options的值，然后评估state的值。问题是在完全评估之前你无法访问App的关联数组，在评估state的值时并非如此。

EDITED

很抱歉没有正确回答。以下是您的第二种方法：

var App = {
    options: {

        /* ------------------------------------
             Options (PREFERABLY DONT CHANGE)
        --------------------------------------- */

        baseDomain     : 'google.com',
        apiVersion     : '/api/v1',
        blah: ''

    },
    blah: function(){

        return App.options.baseDomain + App.options.apiVersion;

    }
}

console.log(App.blah());

Answer 5

你们中没有人回答我的问题....我想了一下......我可以在文字内部使用一个命名函数来访问它...如果我想要（不必要）我甚至可以将其分配回选项对象

http://jsfiddle.net/zDeAJ/9/

var App = {
    options: {

        /* ------------------------------------
             Options (PREFERABLY DONT CHANGE)
        --------------------------------------- */

        baseDomain     : 'google.com',
        apiVersion     : '/api/v1',
        blah: ''

    },
    state: function(){

        this.options.blah = this.options.baseDomain + this.options.apiVersion;

    }
}

App.state();
console.log(App.options.blah);

遇到麻烦以面向对象的方式实现我的应用程序

5 个答案: