javascript - jQuery 与 MVC 中关键字 "this"的含义

Question

我试图理解使用关键字“this”或者它在 jQuery 中代表什么与 Backbone 等 MVC 框架的区别。

下面是每个的 2 个代码示例；所以在 jQuery 中，我们有

$("#result").click(function(){
$(this).html(someval);
})

在 Backbone 中，我们的代码为；

var HandlebarsView = Backbone.View.extend({
el: '#result'
initialize: function(){
this.template = Handlebars.compile($('#template').html());     
},
render: function(){
var html = this.template(this.model.toJSON());
this.$el.html(html);
}
});

现在我明白“this”指的是 jQuery 中的 DOM 元素。

我想了解它在 Backbone 代码中代表什么。

请告诉我。

Answer 1

this 是函数执行的上下文。

理解 this 的诀窍是理解它是您执行决定它的函数的方式。

当您将函数传递给 jQuery 之类的方法时，您将该函数用作回调方法。 jQuery 在执行时明确设置回调的上下文。

当您使用点符号调用对象的方法时:myView.render() 是点符号显式地将方法调用的上下文设置为前面的对象点。

上下文设置的规则在 JavaScript 中非常简单，但会引起很多混淆。大多数语言将自引用上下文变量设置为定义方法的对象。不过，JavaScript 使用方法调用模式来确定上下文。

当我们将任何对象的方法作为回调方法传递时，调用它的代码会设置该方法的上下文——这包括 Backbone 的 View 和其他对象。您可以使用 Underscore.js 的 bind 和 bindAll 函数 ( http://documentcloud.github.com/underscore/#bind ) 以及一些其他技巧来显式覆盖它。

Backbone.View.extend({
  initialize: function(){
    _.bindAll(this);
  }
});

例如，此代码会将当前 View 对象上所有函数的上下文绑定(bind)到 View 。这保证了您的 View 方法的上下文将始终是 View 本身。

有关详细信息，请参阅:

• http://es5.github.com/ - 带注释的 ES5 规范
• http://yehudakatz.com/2011/08/11/understanding-javascript-function-invocation-and-this/
• http://lostechies.com/derickbailey/2011/06/15/solving-backbones-this-model-view-problem-with-underscore-js/
• http://www.watchmecode.net/javascript-context (我自己的截屏视频涵盖了所有规则以及如何使用它们 - 付费截屏视频)