Javascript这个上下文的问题

Question

我遇到以下代码的问题。console.log在logName方法中工作正常，但未在logNameAgain方法中提供所需的输出。我试图google但是徒劳无功。有人可以解释一下这里发生了什么吗？

var testObj = {
    name: "This is test object",
    logName: function() {
        console.log(this.name);  //Works fine 

        function logNameAgain() {
            console.log(this.name); //Not giving expected result;
        }

        logNameAgain();

    }
};

testObj.logName();

jsfiddle

似乎console.log方法中的logNameAgain指向window。这对我来说真的没有意义吗？

更新：我明白这可以通过使用bind / call或self来解决，但我不明白为什么会这样？

Answer 1

尝试使用.bind()（请参阅工作jsfiddle）：

var testObj = {
    name: "This is test object",
    logName: function() {
        console.log(this.name);

        var logNameAgain = function() {
            console.log(this.name);
        }.bind(this);

        logNameAgain();

    }
};

testObj.logName();

问题是logName内的新函数具有window（全局）上下文。所有这些意味着你需要以某种方式传递本地环境。 Function.prototype.bind就是这么做的。

如果担心浏览器支持，你也可以做这件事：

var testObj = {
    name: "This is test object",
    logName: function() {
        var that = this;
        console.log(this.name);

        var logNameAgain = function() {
            console.log(that.name);
        };

        logNameAgain();

    }
};

testObj.logName();

仅当您需要支持IE8及以下版本时才会这样做。这是.bind()的比较表（由MDN提供：