Question

这可以在代码中更好地解释：

var FileResourceManager = {
        LoadRequiredFiles: function (config) {
            config = config || {};

            this.OnLoading = config.onLoadingCallback;
            this.OnComplete = config.onCompleteCallback;

            //this works fine here.
            if (this.OnLoading) {
                this.OnLoading();
            }

            Modernizr.load([{
                load: 'somefile.js',
                complete: function () {
                        //Error in this callback here.
                        if (this.OnComplete) {
                            this.OnComplete();
                        }
                }
            });
        }

    };
    FileResourceManager.LoadRequiredFiles({
        onLoadingCallback: function () {
            alert('started');
        },
        onCompleteCallback: function () {
            alert('complete');
        }
    });

正如您所看到的，在Modernizr.load的complete事件的回调中，我想调用父/外对象的方法。但是this实际上成了Modernizr对象。如何在事件中访问外部对象的属性？

通过使用某种形式的绑定，我在backbone.js项目中看到了这一点。我不确定我是否需要写这样的东西。

Answer 1

var self = this;

Modernizr.load([{
            load: 'somefile.js',
            complete: function () {
                    //Error in this callback here.
                    if (self.OnComplete) {
                        self.OnComplete();
                    }
            }
        });

Answer 2

Modernizr.load([{
            load: 'somefile.js',
            complete: (function () {
                    //Error in this callback here.
                    if (this.OnComplete) {
                        this.OnComplete();
                    }).bind(this)
            }
        });

Answer 3

在Modernizr函数范围内重新定义了this对象。习惯上在范围之外定义一个名为that的变量，并使用它来引用外部this。

或者，您可以使用config对象，如下所示：

complete: function () {
   if (config.OnComplete) {
     config.OnComplete();                        
   }
}

在外部触发的事件中使用原始的`this`

3 个答案: