在事件/回调驱动的JavaScript应用程序中管理“this”

我想知道在jQuery和Backbone.js等框架中经常使用的回调中，处理这种引用的预期方法是什么

下面是一个我遇到问题的简化示例，它使用Backbone.js和jqueryui，但实际上并不特定于这些框架

var MyView = Backbone.View.extend({
   render: function() {
      $('#mybutton').click(function() {
         // My code in here
      });
   },

   callMe: function() {
      alert('Rawr!');
   }
});

---

现在，我如何从单击处理程序内部引用MyView的实例？例如，如何从单击处理程序内部调用callMe？在处理程序之外，我只会叫这个；但这会被click处理程序中的DOM元素所取代。最好的方法是什么？

最有效的方法是将结果存储在另一个变量中，然后在回调中使用它

var MyView = Backbone.View.extend({
   render: function() {
      var that = this;

      $('#mybutton').click(function() {
          // use that for MyView and this for the DOM element
      });
   },

   callMe: function() {
      alert('Rawr!');
   }
});

或者，您可以使用或HTML5方法来定义该值。显然，您将失去使用它来引用DOM元素的能力，因此必须依赖事件对象的target属性

或：

---

最有效的方法是将结果存储在另一个变量中，然后在回调中使用它

var MyView = Backbone.View.extend({
   render: function() {
      var that = this;

      $('#mybutton').click(function() {
          // use that for MyView and this for the DOM element
      });
   },

   callMe: function() {
      alert('Rawr!');
   }
});

或者，您可以使用或HTML5方法来定义该值。显然，您将失去使用它来引用DOM元素的能力，因此必须依赖事件对象的target属性

或：

---

我会这样做的。“事件”属性是将大多数事件处理程序列在一个位置的一种简单方法。bindAllthis将使其引用所有MyView函数中的视图

var MyView = Backbone.View.extend({
   events: {
     'click #mybutton': 'clickHandler'
   },
   initialize: function() {
     _.bindAll(this);
   }
   render: function() {

   },
   clickHandler: function() {
     this.callMe();
   },
   callMe: function() {
      alert('Rawr!');
   }
});

---

我会这样做的。“事件”属性是将大多数事件处理程序列在一个位置的一种简单方法。bindAllthis将使其引用所有MyView函数中的视图

var MyView = Backbone.View.extend({
   events: {
     'click #mybutton': 'clickHandler'
   },
   initialize: function() {
     _.bindAll(this);
   }
   render: function() {

   },
   clickHandler: function() {
     this.callMe();
   },
   callMe: function() {
      alert('Rawr!');
   }
});

---

你试过MyView.callMe吗？@Bogdan Emil-Mariesan:不会是实例调用你试过MyView.callMe吗？@Bogdan Emil-Mariesan:不会是实例调用谢谢jQuery代理方法。我最初使用的var=this；但这似乎有点老套。再补充一点：根据经验，创建变量最好是在回调可以嵌套的时候，因为词汇范围涵盖了这一点。当您不能或不想重写使用this的函数时，使用代理和绑定是最好的。@Tomdarkness：我想强调的是，在这种情况下，大多数经验丰富的开发人员都希望使用var=this方法。感谢jQuery代理方法。我最初使用的var=this；但这似乎有点老套。再补充一点：根据经验，创建变量最好是在回调可以嵌套的时候，因为词汇范围涵盖了这一点。当您不能或不想重写正在使用this的函数时，使用代理和绑定是最好的。@tomdark:我想强调的是，在这种情况下，大多数经验丰富的开发人员都希望使用var=this方法。