Question

为什么我不能通过使用“this”来引用JavaScript对象的方法？例如，在open();方法中 - 为什么我不能调用this.init();？

    var myModule = {

        //Initialize dek. Append html structure to the body
        init: function() {
            if (!$('.mwdek').length) {
                var dek = $(tpl);
                dek.find('.d-nav-close').on('click', function(e) {e.stopPropagation();e.preventDefault();
                    this.destroy();
                });
                dek.appendTo('body');
            }
            //var dek = $('.mwdek');

        },

        //Opens deck, makes it visible
        open: function() {
            if (!$('.mwdek').length) {
                this.init();
            }
            $('.mwdek').addClass('active');
        },

        //Removes deck html from the page
        destroy: function(messages) {
            $('.mwdek').remove();
        },

        //Pass in header text content
        setHeaderText: function() {

        }


    };

Answer 1

除了涉及this变量的init函数中的1个问题外，逻辑看起来很好。在object.method()之类的声明中，method函数中，this指的是object。记住这一点。

现在，这是代码中有问题的部分：

init: function() {
    if (!$('.mwdek').length) {
        var dek = $(tpl);
        dek.find('.d-nav-close').on('click', function(e) {
            e.stopPropagation();
            e.preventDefault();
            this.destroy();     //THIS LINE has the issue!
        });
        dek.appendTo('body');
    }
}

我评论的行上的this变量位于您编写的匿名函数（function(e) {...}）中。此函数提供给JQuery，以便在发生适当的单击时运行。所以JQuery决定如何调用该函数，这意味着只有JQuery才能真正理解调用该函数时this将引用的内容。在您的代码中，您依赖this指向dek的实例，但事实并非如此。为了解决这个问题，您可以执行以下操作（选择将变量that命名为常见约定）：

init: function() {
    var that = this; //Maintain a reference to "this" even inside anonymous functions
    if (!$('.mwdek').length) {
        var dek = $(tpl);
        dek.find('.d-nav-close').on('click', function(e) {
            e.stopPropagation();
            e.preventDefault();
            that.destroy();     //Originally "this.destroy();"
        });
        dek.appendTo('body');
    }
}

JavaScript对象文字。为什么我不能通过“this”来引用方法？

1 个答案: