Question

我最近开始阅读“JavaScript：好的部分”并引用一个我无法理解的例子。我在原始示例中添加了test函数：

var add = function(a,b) {
    return a+b;
};

var myObject = {
    val: 0,
    increment: function(inc) {
        this.val += typeof inc == 'number' ? inc : 1;
    }
};

myObject.increment(12);
myObject.increment();
// till this line, the val is equal to 13

// function invocation
myObject.double = function() {
    var that = this;

    // inner function #1
    var helper = function() {
        that.val = add(that.val, that.val);
    };
    // inner function #2
    var test = function(){
        this.val = add(this.val, this.val);
    };

    helper();   // the val is equal to 26
    // test();  // the val is equal to 13
};

当我使用that（var that = this）时，我指的是myObject的字段val。另外，当我在test函数中使用它时，我指的是同一个对象中的相同字段，但答案是不同的。任何解释都将不胜感激。

Answer 1

在

中使用this时

var test = function(){
   this.val = add(this.val, this.val);
};

this实际上是指test，而不是myObject，因此this.val未定义且this.val = add(this.val, this.val);实际上什么也没做。这就是val值没有改变的原因。

Answer 2

尝试在浏览器控制台中运行此代码：

var obj = {
    val: 0
};

obj.func = function() {
    var that = this;

    console.log(this); // this refers to obj

    var test1 = function() {
        console.log(this);
    };

    test1(); // this refers to the global scope or window

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

    test2(); // this or that refers to obj
}

obj.func();

在javascript中，关键字this可能非常棘手。 this的值取决于函数的调用方式。第一个console.log表示this中的obj.func表示obj。对于下一个示例，关键字this位于函数test1的范围内。更重要的是，test1的调用方式与obj.func不同。因为test1在没有左边的点（作为对象的属性）的情况下被调用，所以关键字this实际上是指全局范围。您可以将代码视为window.test1()。最后一个示例显示了行var that = this有用的原因，它将上下文维护为obj。

JavaScript函数调用

2 个答案: