Javascript变量范围。 如何从内部对象函数访问对象变量？

Question

我想知道如何使用javascript对象中的函数访问“ nam” e变量，如下所示：

function myObj() {
    this.vars = {
        name: 'bob',
        age: '42'
    }
    this.functions = {
        sayName: function() {
            alert(this.vars.name);
        }
    }
}

var obj = new myObj();
obj.functions.sayName();

我在这里想念什么？

如果我像这样传递对自身的引用，则可以得到名称var：

function myObj() {
    this.vars = {
        name: 'bob',
        age: '42'
    }
    this.functions = {
        sayName: function(name) {
            alert(name);
        }
    }
}

var obj = new myObj();
obj.functions.sayName(obj.vars.name);

但这似乎有点多余...想法？

Answer 1

问题在于，在您的函数this.functions.sayName ， this关键字引用this.functions而不是当前对象¹ 。

这是该问题的解决方法：

function myObj() {
    var vars = this.vars = {
        name: 'bob',
        age: '42'
    }
    this.functions = {
        sayName: function() {
            alert(vars.name);
        }
    }
}

var obj = new myObj();
obj.functions.sayName();

这将在myObj内创建一个局部变量，您可以从任何内部范围访问该局部变量。 它还将该变量作为任何实例化的myObj类的属性公开给外部世界，这意味着您仍然可以执行类似的操作

obj.vars.name = 'test';

并且仍然会更改对象的内部状态。 这可能是当前设置的最佳解决方案。

¹ JavaScript中this关键字的行为很有趣。 我建议在Mozilla开发人员网络上撰写出色的论文。

Answer 2

你可以这样做：

var thisObj = this;
this.functions = {
    sayName: function() {
        alert(thisObj.vars.name);
    }
}

不知道这是否是最好的解决方案，但是它可以工作。 JavaScript的这通常是指内部范围，如果你是一个函数内。

Answer 3

只是删除this ：

function myObj() {
    var vars = {
        name: 'bob',
        age: '42'
    };
    this.functions = {
        sayName: function() {
            alert(vars.name);
        }
    };
};

var obj = new myObj();
obj.functions.sayName();​

现场演示