2

我正在使用原型创建一个 Javascript“类”。我不明白为什么第一个/第二个块不起作用，而第三个块会起作用。对于第一个/第二个块，我得到：“对象＃没有方法'验证'”。为什么要这样做，并且块 3 是正确的方法吗？

--编辑 我已经在 Chrome/FF 中测试过这个

--Edit2 如果我调用测试原型： var test = new Test();

并在登录原型中调用测试变量它将起作用....

区块 1

    功能测试（）{
        this.init();
    }

    Test.prototype.init = function(){
        $(".login").click(this.login);
    };

    Test.prototype.login = 函数（事件）{
        event.preventDefault();

        this.validate();

        console.log("登录");
    };

    Test.prototype.validate = function(){
        console.log("验证");
    };

新测试（）；

第 2 座

    功能测试（）{
        this.init();
    }

    Test.prototype.init = function(){
        $(".login").click(this.login);
    };

    Test.prototype.login = 函数（事件）{
        变种自我=这个；
        event.preventDefault();

        self.validate();

        console.log("登录");
    };

    Test.prototype.validate = function(){
        console.log("验证");
    };

    新测试（）；

区块 3

    功能测试（）{

    if(!(this instanceof LoginController)){
        返回新的登录控制器（）；
    }

        自我=这个；

        this.init();
    }

    Test.prototype.init = function(){
        $(".login").click(this.login);
    };

    Test.prototype.login = 函数（事件）{
        event.preventDefault();

        self.validate();

        console.log("登录");
    };

    Test.prototype.validate = function(){
        console.log("验证");
    };

    新测试（）；
4

1 回答 1

2 
Test.prototype.init = function(){
  $(".login").click(this.login);
};

在这里，您将附加this.login为事件处理程序。通过这种方式，该函数将由thisjquery 将其值重新分配给触发事件的元素。

要保留对this您实际想要的值的引用，请尝试：

Test.prototype.init = function(){
  var self = this;
  $(".login").click(function (evt) {
     return self.login(evt);
  });
};

或用于实现的浏览器bind：

Test.prototype.init = function(){
  $(".login").click(this.login.bind(this));
};

或jQuery.proxy，其作用与 相同bind：

Test.prototype.init = function(){
  $(".login").click($.proxy(this.login, this));
};

演示：http: //jsbin.com/ilejiw/1/

更新：不，第三种变体不是正确的方法，因为每个实例Test都会覆盖相同的全局self变量。所以self会指向最后一个实例Test（只要它没有被其他东西覆盖）。

于 2013-01-23T11:44:39.523 回答