Question

我很惊讶我在这个主题上找不到更多（可能是我的低于标准的搜索技能）。通常，一旦我认为我理解JavaScript关键字“this”如何工作，它就会停止按照我理解的方式工作。我会解决一个这样的问题。

我的理解：“当使用'new'关键字调用函数时......'this'指的是根函数/'class'。当从实例化的'class'中的函数使用时，这指的是CALLING函数”。 - 理解这一点非常重要：当从页面上的另一个函数调用函数时，'this'关键字将引用调用函数，而不是目标函数所在的“类”。

在下面的例子中，我尝试了两种从公共函数设置变量的方法。两者都失败了我试图理解这是为什么以及如何使这项工作。

var functionClass = new function(){

    var _isReady = false;

    var _getReady = function(){
        // ... do some work to get ready
        _isReady = true;
    }

    return {

        IsReady: _isReady,
        GetReady: _getReady
    }
}



var functionClass1 = new function () {

    var _isReady = false;
    var _self = this;

    var _getReady = function () {
        // ... do some work to get ready
        _self.IsReady = true;
    }

    return {

        IsReady: _isReady,
        GetReady: _getReady
    }
}


functionClass.GetReady();
functionClass1.GetReady();

console.log(functionClass.IsReady);  // Expect true ... I get false
console.log(functionClass1.IsReady); // Expect true ... I get false

更新：

我可能应该指出我正在使用Revealing Module Pattern，并希望任何解决方案都在这种情况下。虽然我确信有很多不同的方法可以做到这一点，但我希望将解决方案集中在这种模式上。

Answer 1

试试看这是否是你需要的

 var functionClass = (function(){

        var _isReady = false;

        var _getReady = function(){
            // ... do some work to get ready
            _isReady = true;
        }

        return {

            IsReady: _isReady,
            GetReady: _getReady
        }
    })();

Answer 2

使用'new'关键字调用函数时......'this'指的是根函数/'class'

没有。它引用一个新实例化的对象，它继承自构造函数'prototype属性上的对象。如果没有从函数中显式返回，则此对象将是new - 表达式的结果。

当从实例化的'class'中的函数使用时，这指的是CALLING函数“

没有。它通常指的是实例。

当从页面上的另一个函数调用该函数时，'this'关键字将引用调用函数而不是目标函数所在的'class'

没有。同样，它通常指的是实例。虽然它总是取决于函数的调用方式 - 阅读MDN's introduction to the this keyword。

在您的情况下，创建模块时，您根本不应使用new。任何地方都没有遗传。将其更改为立即执行的函数表达式（IEFE，您可以搜索它）。

那为什么你的两次尝试现在都失败了？

为functionClass分配了一个对象，该对象具有两个属性：GetReady设置为_getReady函数，IsReady设置为{{1}的值即_isReady。但是，当您调用该方法时，它只会更改false变量，而不会更改_isReady的{{1}}属性。

在IsReady中，您正确分配给某个媒体资源。但是什么？ functionClass是模块函数的functionClass1值，它被滥用为构造函数，如上所述，它是一个继承自另一个对象的对象（其_self是用于模块的匿名函数）。它不是 - 正如您所期望的那样 - 您this所做的.constructor对象。

那么如何正确引用该对象？嗯，最简单的选择是使用它的变量名。另一个选择是在getReady函数中使用functionClass1，如果它使用return调用，它将引用该对象。有关优缺点，请参阅Javascript: Object Literal reference in own key's function instead of 'this'。

this

使用“this”关键字从内部函数设置JavaScript“class”属性？

2 个答案: