Question

以下是“Javascript - The Good Parts”的工作示例。

function add(x, y){ return x + y};

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

myObject.increment(2);
document.writeln(myObject.value); 

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

    var helper = function (  ) {
        that.value = add(that.value, that.value)
    };

    helper(  );    // Invoke helper as a function.
};

myObject.double(  );
document.writeln(myObject.value);    // 4

对于函数调用模式，'this'对象将具有全局引用。但我无法完全理解所提到的解决方法的内幕： -

var that = this;    // Workaround.

如果我们这样做，我们不是只是将'this'的引用复制到'that'吗？即'that'将与'this'一样保持全球范围？这在内部如何运作？

Answer 1

这里不一样，this引用myObject，因此您获得了正确的value属性，this将引用window ...这就是为什么你要保留像它一样的参考。

You can test it out here，helper函数中的一些警告会显示正在发生的事情。

另一种方法是.call()或.apply()具有正确上下文的函数，因此this继续引用您想要的myObject实例...就像这样：

myObject.double = function () {
    var helper = function () {
        this.value = add(this.value, this.value)
    };
    helper.call(this);    // Invoke helper as a function.
};

You can test that version here

Answer 2

这里涉及两个功能：一个是myObject.double，另一个是helper。当您致电myObject.double()时，这会引用myObject。所以that === myObject。稍后，在该函数内部，您还可以调用helper()，并在该范围内this === the global object。

JavaScript中的函数调用模式作用域规则

2 个答案: