Javascript'this'值改变了,但无法弄清楚原因

Question

我是一个完整的Javascript newb,我正试图围绕OLN.我遇到的是,当从同一个对象上的另一个方法调用一个对象方法时,被调用方法中'this'的本地值的值正在改变.这是我的代码:

var generator = {
    generateForLevelSkillAndCount : function(level, skill, count) {
        var functionCall = this['generate_' + level + '_' + skill];
        return functionCall(count);
    },
    generate_0_4 : function(count) {
        return this.generate_generic_dots(count, 3);
    },
    generate_generic_dots : function(count, maxDots) {
        /* do cool stuff and return it */
    }
};

所以,我打电话generator.generateForLevelSkillAndCount(0, 4, 20),它正常工作,打电话generate_0_4(count).然而,这是失败的地方,Chrome的Javascript控制台告诉我"未捕获的TypeError:对象[对象DOMWindow]没有方法'generate_generic_dots'."

我知道的问题是,问题是thisin 的值generate_0_4是一个DOMWindow对象,而不是生成器(这this是指向的内容,generateForSkillLevelAndCount但我无法弄清楚为什么会发生这种情况.

更新:我根据CMS的建议更新了示例代码eval,但是返回了相同的错误,因此它不仅仅是一个eval错误.

Answer 1

在JavaScript中,上下文对象(this)设置为"全局对象"(window在浏览器中),除非该方法作为对象属性进行访问.因此:

var foo = { bar: function() { alert(this.baz); }, baz: 5 };
var bar = foo.bar;
var baz = 3;

foo.bar();    // alerts 5, from foo
foo["bar"](); // alerts 5, from foo
bar();        // alerts 3, from the global object

请注意,所有三个函数调用都是完全相同的函数!

因此,在您的代码中,您将所需的方法分配functionCall给它并直接调用它,这会导致该函数window用作其上下文对象.有两种方法:访问方法作为对象属性或使用.call()或.apply():

function generateForLevelSkillAndCount1(level, skill, count) {
    return this['generate_' + level + '_' + skill](count);
}

function generateForLevelSkillAndCount2(level, skill, count) {
    var functionCall = this['generate_' + level + '_' + skill];
    return functionCall.call(this, count);
}