Javascript 什么时候需要在Backbone.js中使用u.bindAll()?
我正在学习backbone.js,对此感到困惑: 我正在学习教程: 正如您在第一个示例(1.js)中看到的:Javascript 什么时候需要在Backbone.js中使用u.bindAll()?,javascript,backbone.js,Javascript,Backbone.js,我正在学习backbone.js,对此感到困惑: 我正在学习教程: 正如您在第一个示例(1.js)中看到的: (函数($){ var ListView=Backbone.View.extend({ el:$('body'),//将'this.el'附加到现有元素。 初始化:函数(){ _.bindAll(this'render');//修复了方法中“this”上下文的丢失 this.render();//并非所有视图都是自呈现的。这一个是。 }, render:function(){ $(th
(函数($){
var ListView=Backbone.View.extend({
el:$('body'),//将'this.el'附加到现有元素。
初始化:函数(){
_.bindAll(this'render');//修复了方法中“this”上下文的丢失
this.render();//并非所有视图都是自呈现的。这一个是。
},
render:function(){
$(this.el)。追加(“- 你好,世界
”;
}
});
var listView=new listView();
})(jQuery);
但是如果我把这句话注释掉:
uuz.bindAll(这个“render”)代码>,这仍然有效。我在谷歌上搜索过,有人说方法bindAll()
是必要的,因为如果我切换了上下文,调用this.render
可能不可用。我对“上下文”感到困惑。还有人能解释一下调用(this.render
)什么时候不可用吗?在这种情况下,您不需要\uuu.bindAll
,但假设您的视图有一个导致重新渲染的方法,您可以这样做:
..,
myMethod: function() {
this.$('.someselector').change(this.render);
},
如果您没有用于渲染的\ucode>.bindAll
,您的上下文将被关闭
- 在视图的事件散列中列为属性值的任何方法都会由主干自动为您绑定
- 视图中手动用作模型或集合事件处理程序的任何方法都应通过
bindAll
- 或者,可以在注册绑定时提供上下文
- 也可以使用EMCA 5获得相同的结果
片段:
events: {
'click .win': 'win',
'click .lose': 'lose'
},
initialize: function () {
//win and lose are automatically bound for you
//because they are in the events property
//refresh must be manually bound
this.model.on('change', this.refresh);
//which you can do ECMA5 style if you like
this.model.on('change', this.refresh.bind(this));
//OR you can provide a context backbone style
this.model.on('change:foo', this.fooChange, this);
//However, since you pretty much never want an unbound function
//in a view, you can just stick this in all your initialize methods
//and call it done
//Note this will bind all functions in your view class if you don't
//pass specific method names. I recommend this form.
_.bindAll(this);
},
win: function () {...},
lose: function () {...},
refresh: function () {...},
fooChange: function() {...}
…只需使用CoffeeScript和fat箭头,并在语言级别上清晰地解决此问题。对于您给出的示例\uuuo.bindAll(此“渲染”)
不是必需的,但是如果您有回调函数,其中这个
可以更改为其他内容的上下文,那么\u bindAll()
就很方便了
例如:
initialize: function(){
_.bindAll(this, 'render', 'clickFunc');
},
events: {
'click .someElement': 'clickFunc'
},
clickFunc: function(e) {
/** If you remove the clickFunc from the list of events in bindAll,
'this' will refer to the element that invoked the event.
Adding the clickFunc event in the _.bindAll, ensures that 'this' stays
as the view.
*/
this /** <-- our focal point */
}
初始化:函数(){
_.bindAll(这是'render','clickFunc');
},
活动:{
'click.someElement':'clickFunc'
},
clickFunc:函数(e){
/**如果从bindAll中的事件列表中删除clickFunc,
“this”将引用调用事件的元素。
将clickFunc事件添加到uz.bindAll中可确保“this”保持不变
如图所示。
*/
这个/**让我们仔细看看\uu.bindAll
从中做了什么
\uuu.bindAll=函数(obj){
变量i,length=arguments.length,key;
如果(事件的长度)中的任何内容都是由主干自动绑定的,仅供参考。非常好的解释,伟大的jobI更喜欢u.bindAll(这个)此外,但下划线不推荐使用,而且自1.5.0版本以来,它将不再受支持。在更改日志中,您可以阅读:删除了在没有方法名参数的情况下调用u.bindAll的功能。将要绑定的方法的名称列为白名单通常会更明智。我认为这是一个错误。这将使我更难理解维护。@ccsakuweb我目前正在一个web界面上工作,在这个界面上我大量使用主干网。在这个项目中,我目前只有一个对.bindAll
的调用,没有一个对.bind
的调用。相反,我使用this.listenTo
来监听模型事件,使用事件
散列来监听DOM事件等,并提供context则相反。一个.bindAll
调用用于后台自动刷新器的run
方法,该方法调用setTimeout(this.run,period)
,这会导致run
方法失去其上下文。没有.bindAll
的情况下,到目前为止所有其他内容都是完全可以管理的。
initialize: function(){
_.bindAll(this, 'render', 'clickFunc');
},
events: {
'click .someElement': 'clickFunc'
},
clickFunc: function(e) {
/** If you remove the clickFunc from the list of events in bindAll,
'this' will refer to the element that invoked the event.
Adding the clickFunc event in the _.bindAll, ensures that 'this' stays
as the view.
*/
this /** <-- our focal point */
}
_.bindAll = function(obj) {
var i, length = arguments.length, key;
if (length <= 1) throw new Error('bindAll must be passed function names');
for (i = 1; i < length; i++) {
key = arguments[i];
obj[key] = _.bind(obj[key], obj);
}
return obj;
};