在 js 对象中使用 `this`答案

【问题标题】：Using `this` in a js object在 js 对象中使用 `this`
【发布时间】：2011-07-25 11:30:10
【问题描述】：

我有以下 js 对象：

var livePage = {
    delay: 1000,
    loadTables: function(){
        loadTable($("#vbeTable"),'getUpdateA')
        loadTable($("#vbcTable"),'getUpdateB')
        createAlertDialog();
    },
    setClicks: function(){
        $(".expand").live('click',function(){
            expand($(this).attr('expandvalue'));
        })
        $( ".launch" )
            .click(function(){
                newPopup('index.php',1120,550);
            });
        $('.edit').live('click',function(){
            openColPick($(this).attr('colType'))
        });
    },
    setRightClick: function(){
        $('body').contextMenu('mainmenu', {
              bindings: {
                'o_o': function(t) {
                  thePopupWindowsMain('oo','','',220,150,'right','');
                },
                'o_h': function(t) {
                  thePopupWindowsMain('oh','','',285,385,'left','');
                },
                'launch_prog': function(t) {
                  $(".launch").click();
                },
                'logout': function(t){
                    window.top.location = 'logout.php';
                }
              }
            });
    },
    setWindow: function(){
        $(window)
            .resize(function() {
                $('body').css('height', $(this).height())
                alertToCorner();
            })
            .scroll(function(){$(this).resize()});
        $(window).resize();
    },
    checkLogout: function(){
        $.ajax({
            url: 'getLogin.php',
            dataType: "html",
            success: function(data){
                if($.trim(data) == 'LOGOUT'){
                    window.location = 'logout.php';
                }
            },
            complete: function(){
                setTimeout( function () {
                    livePage.checkLogout();},
                livePage.delay)
            },
            timeout: 2000
        });
    },
    init: function(){
        this.checkLogout();
        this.loadTables();
        this.setClicks();
        this.setRightClick();
        this.setWindow();
        console.log(this);
    }
}

由于某种原因在checkLogout: function() 中我必须使用livePage.delay 和livePage.checkLogout() 当我尝试使用例如this.checklogout() 时，我在Chrome 的控制台中收到以下错误：

未捕获的类型错误：对象 [对象 DOMWindow] 没有方法'checkLogout'

我该如何解决这个问题？

谢谢！

【问题讨论】：

标签： javascript jquery object this

【解决方案1】：

函数内部this 不再绑定到它绑定到外部的任何内容。最简单的解决方案是使用var self = this; 分配给另一个var，或者在您的情况下通过$.ajax() 的context: this 选项传递它。

【讨论】：

这行得通:-) 我在checkLogout() fn 的顶部添加了var self = this;，我用self 代替了this 谢谢^_^

【解决方案2】：

你可以试试，

 checkLogout: function(){
        var self = this; //reference to the livePage object
        $.ajax({
            url: 'getLogin.php',
            dataType: "html",
            success: function(data){
                if($.trim(data) == 'LOGOUT'){
                    window.location = 'logout.php';
                }
            },
            complete: function(){
                setTimeout( function () {
                    self.checkLogout();},  //need to use self because 'this' no longer refers to livePage in this context
                livePage.delay)
            },
            timeout: 2000
        });
    }

【讨论】：

【解决方案3】：

this 在 js 中与在 C# 等语言中大不相同。首先，它是函数范围的。其次（可能更重要的是），您可以控制调用函数时this 将是什么。（查看“调用”和“应用”函数，它们在 javascript 框架中使用得非常频繁。）

【讨论】：

【解决方案4】：

阅读 Javascript 中的 this this keyword。在你的情况下，this 指的是窗口，就像错误所说的没有方法'checkLogout'。

【讨论】：

【解决方案5】：

您应该将context: this 属性添加到您发送到$.ajax 的哈希中，然后在完整的处理程序调用this.checkLogout 中。

JQuery 的 ajax 方法将使用 window 作为 this 上下文调用处理程序，我们可以通过在调用中添加 context 属性来更改它。

【讨论】：