8

我正在学习 javascript，但遇到了疑问。为什么在第一个示例中未定义“this”的值，但在第二个示例中正确打印出来。

示例 1：

var myNamespace = {
    myObject: {
        sayHello: function() {
            console.log( "name is " + this.myName );
        },
        myName: "john"
    }
};

var hello = myNamespace.myObject.sayHello;

hello(); // "name is undefined"

示例 2：

var myNamespace = {
    myObject: {
        sayHello: function() {
            console.log( "Hi! My name is " + this.myName );
        },
        myName: "Rebecca"
    }
};

var obj = myNamespace.myObject;

obj.sayHello();//"Hi! My name is Rebecca"

为什么“this”的值在函数内会发生变化。我错过了什么概念？

4

2 回答 2

4

第一种情况，您只是获取函数对 vairable 的引用hello，并从全局上下文（浏览器中的窗口，节点中的全局）调用它，因此this除了（绑定函数）之外，它成为调用函数的对象。您始终可以使用 function.call显式设置上下文或使用 Ecma5 function.bind 将上下文显式设置为函数

hello.call(myNamespace.myObject); //now you are setting the context explicitly during the function call.

或者只是在获取函数引用时绑定它。

var hello = myNamespace.myObject.sayHello.bind(myNamespace.myObject); //Now no matter where you call it from `this` will point to the context of myObject

第二种情况是您从对象本身调用它，因此this指向对象。

于 2013-10-09T16:21:32.367 回答
1

在第一种情况下，隐式this对象是全局范围。因为myName在全局范围内没有，所以你得到未定义。

如果您想要一个具有正确的免费功能this，请使用bind：

var hello = myNamespace.myObject.sayHello.bind(myNamespace.myObject);
于 2013-10-09T16:20:55.037 回答