Question

假设我有一个namespace和几个function，例如这样：

HTML

<input type="button" class="btn" value="click">

JAVASCRIPT

var nms = {
 doAlert: function(){
     alert('doing alert');
     console.log(this);
 },
 bindBtn: function(){
     var that = this;
     $('.btn').on('click', that.doAlert);
 }

}

nms.bindBtn();

log打印<input type="button" class="btn" value="click">，换句话说，this指的是我正在执行function的元素。

这可能是我的缺点，但我想了解如何引用nms而不是input。如果可能，请使用this

Answer 1

您应该使用proxy() jquery的方法来应用特定的上下文：

$('.btn').on('click', $.proxy( this.doAlert, this ));

DEMO

Answer 2

有很多方法可以做到这一点。我更喜欢在IIFE（立即调用的函数表达式）中定义对象，以便它可以使用私有变量来跟踪自身：

var nms = (function () {
    var myownself = {
        doAlert: function () {
            alert('doing alert');
            console.log(myownself);
        },
        bindBtn: function () {
            $('.btn').on('click', myownself.doAlert);
        }
    };
    return myownself;
})();

nms.bindBtn();

演示：http://jsfiddle.net/Yu5Mx/

这样，该对象的所有方法都可以引用myownself变量，但是他们不需要知道nms变量，通过该变量可以知道对象的其余部分。你的代码。如果你做了类似的事情：

var temp = nms.bindBtn;
temp();

...在this中“混淆”bindBtn()的值然后无关紧要，因为bindBtn()仍会使用myownself。

请注意，此模式假定nms将是单个对象。如果您希望能够实例化多个副本，您仍然可以使用相同的一般想法，但使用工厂函数或常规构造函数与new（而不是IIFE）。

Answer 3

var nms = {
 doAlert: function(){
     alert('doing alert');
     console.log(this);
 },
 bindBtn: function(){
     $('.btn').on('click', nms.doAlert.bind(nms));
 }
}

要支持IE的绑定，您可以use this

Answer 4

试试这个

var nms = {
 doAlert: function(){
     alert('doing alert');
     console.log(this);
 },
 bindBtn: function(){
     var that = this;
     $('.btn').on('click', function(){
        nms.doAlert.apply(that);

     });
 }

}

nms.bindBtn();

Demo

这会将that传递给函数this

您也可以使用call()

一些链接

apply() call();

或不使用电话或申请

var nms = {
 doAlert: function(){
     var _this = nms;
     alert('doing alert');
     console.log(_this);
 },
 bindBtn: function(){
     var that = this;
     $('.btn').on('click', nms.doAlert);
 }

}

nms.bindBtn();

Demo

这指的是被点击的对象而不是命名空间

4 个答案: